What is the event object in Javascript, how does it work with something like event.preventDefault()?
Hello, can someone explain how the
event object passed as a parameter when declaring a callback function works when using the addEventListener function please.
For example, when we write event.preventDefault() in a form submission, what does event refers to?26 Replies
Different events area different, but all of them share a few properties and methods. They're too numerous to enumerate here, but have a looksie:
https://developer.mozilla.org/en-US/docs/Web/API/Event
For example, a
click event is really a MouseEvent that contains the info about what button was clicked (mouse 1 or 2), the X and Y coordinates of the mouse pointer, what, if any, "modifier keys" are being held down—CTRL, CMD, ALT, etc.what he said, but there is also custom events that can be dispached like regular events, and they work in whatever way you want them to
for example, ive implemented an event that would do the equivalent of firing an
open event on a dialog
yes, that doesnt exist, but i needed itah ok we can create custom events?
that's interesting
yep I see, so like the event object represent information about what triggered that specific action? Like when I click, the event object contains all information about that event, click, which button has been clicked etc ?
I'm going to be using custom events later today in my stream, if you're gonna be around for it
Indeed
oh can try to have a look, is there any where I should go/time ?
ok noted, will try to attend the stream
there are many many many many many events
submit only happens on submit and contains the button that was clicked
scroll contains how far it scrolled in some magical units
resize wont have anything special
dialogs can use a cancel event and a close event, and both happen when closing in 2 different situations and behave differently
I don't think you need to iterate all the different events, my dude :p
dialogs, hmm the textarea element thing? or it's another element ?
oh ok I see
it's a pop-up kind of, can be very useful
it is very useful
Super useful, yeah
yeah for sure
will need to use that
i was just saying a few, and used the dialog one to show that the same intended effect can fire different events
I always created my own "pop-up", can be difficult at times
"can be" is putting it nicely
That used to be how things were done. The dialog element is pretty new: 2022
oh ok
2022 was when safari added it, but it existed for a long time, no?
i think it is from 2018 or 2019
Most HTML elements, JS properties, and JS stuff has a big header at the top of their MDN article saying when it became widely available
Chrome added it in 2014, according to MDN
But yes, "widely available" means FF, Chrome, and Safari
yeah, it's sad it took so long to get into safari
it is also older than i thought