When you first learn about jQuery event processing, the first example is how to prevent the browser from executing the default action. For example, the following code demonstrates the click event:
Copy codeThe Code is as follows:
$ ("A. toggle"). click (function (){
$ ("# Mydiv"). toggle ();
Return false; // Prevent browser from visiting '#'
});
This function uses toggle to show or hide # mydiv, and then prevents the browser from continuing to access the link specified in href.
The example above will give users a bad habit of using "return false" to prevent browsers from executing default behaviors. In this article, I will discuss two important topics that prevent the browser from executing default behaviors:
• Select the correct method:Return false or preventDefault, stopPropagation or stopImmediatePropagation
• Select a proper location, start, end, or a place in the middle:Which part of the Event Callback should you cancel the default browser action?
Note:When I mention event bubbling in this article, I want to express that most events are triggered on the initial DOM first, and then go up through the DOM tree, triggered on each parent element, the event is not bubbling on the sibling node or child node (when the event is bubbling down, we call it event capturing )), you can learn more here