Menu
From this tutorial, it is said:
preventDefault();does one thing: It stops the browsers default behaviour.
I searched online for the examples of preventDefault(), I can only see in two situations (link, form) we use preventDefault(): Prevent a submit button from submitting a form and prevent a link from following the URL.
So, my question is:
In what other situations can we use preventDefault()?
How could I find out all the browsers default behaviour? e.g. if I click a button, what is the browsers default behaviour?
425
The preventDefault() method is used to prevent the browser from executing the default action of the selected element. It can prevent the user from processing the request by clicking the link. Parameters: It does not accept any parameter.
We can use the event. defaultPrevented property in the event object. It returns a boolean indicating if the event. preventDefault() was called in a particular element.
In a web page, you should call the preventDefault() method of the event if you have accepted the drop, so that the browser's default handling is not triggered by the dropped data as well. For example, when a link is dragged to a web page, Firefox will open the link.
The preventDefault stops the default browser behaviour when an event is fired like not redirecting the page on url click etc. The returnfalse also stops the default browser behaviour when an event is fired and does not let the event propagate. The callback execution is also stopped is returned immediately when called.
1.in what else situation we can use preventDefault()?
Actually any type of event, you can stop its default behavior with the preventDefault();
So not only submit buttons, but keypresses, scrolling events, you name it and you can prevent it from happening. Or if you'd like add your own logic to the default behavior, think of logging an event or anything of your choice.
2.how could I find out all the browsers default behaviour? e.g. if I click a button, what is the browsers default behaviour?
What do you mean with this? Mostly the default behavior is kind of implied. When you click a button, the onclick event fires. When you click the submit button, the form is submitted. When the windows scrolls, the onscroll event fires.
196
1) In what else situation we can use
preventDefault()?
Various form fields update their state in response to certain events, such as a checkbox when you click it. If you preventDefault on click, the checkbox reverts to its earlier checked state. There are lots of behaviors — when keys are pressed, when the window is scrolled, when an element is focussed...
2) How could I find out all the browsers default behaviour? e.g. if I click a button, what is the browsers default behaviour?
The specification lists the "activation behavior" of each element. Compare the activation behavior described for a elements to that described for input[type=checkbox], for instance. (The "pre-click activation steps" are interesting, too.)
33
Every item in the DOM has some 'default behaviour'. This is for every browser about the same (some exceptions excluded). If you want your own logic to be executed instead of the default behavior, you can use the preventDefault() function. The same goes for the stopPropagation() function which stopt events from bubbling up the event tree if you just want your own logic being executed and nothing else from there on.
41
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
