Custom buttons won't fire "input" event
I am building a calculator and I want to allow the user to also type it using their own keyboard, for that, I am trying to use "input" event on the input-text, so it fires on both ways of typing.
The thing is that the input event isn't firing when clicking on the DOM buttons, only when I use my keyboard. Why?
Codepen: https://codepen.io/leoncelestino/pen/NWZwYgq (Use mobile view for better UI)
19 Replies
it's working
but instead of adding a click event to a random element, wrap everything in a form, set all buttons to be of type
submit and then handle and prevent the submit event
to get the button, you can do e.submitterdone
that should be a lot more reliable
why it doesn't fire the console.log(e)?
on the input event
because you didn't interact with the input
The input event fires when the value of an <input>, <select>, or <textarea> element has been changed as a direct result of a user action (such as typing in a textbox or checking a checkbox).https://developer.mozilla.org/en-US/docs/Web/API/Element/input_event
what could I do then to use both keyboard and html buttons as input?
exactly what you're doing
oninput event?
i would detect key presses on the form
or on the window, depends
how so
the same way you're doing the other events
ic
document.addEventListener("keyup",(event)=>{
if(event.key === 'a' ){
console.log("key a is press")
}
})
i would do it on the window, but besides that, that's the idea
Don't forget to pass the event to the function and correct the camel case of addEventListener
Yep
also, maybe prevent default as well?
parseInt(value) returns NaN
parseInt(str) === NaN - false
:linux:
NaN is never equal to NaN
NaN === NaN is always false
also, why are you trying to parse the value?
just append as a string