Home:ALL Converter>Event Handling order

Event Handling order

Ask Time:2010-03-04T00:01:33         Author:Andrew

Json Formatter

Javascript jQuery event handling

If on event (for example 'click') bound one function for parent element and another handler function for child DOM element, which of them are called? If all of them will be called, in which order are they called?

Author:Andrew,eproduced under the CC 4.0 BY-SA copyright license with a link to the original source and this disclaimer.
Link to original article:https://stackoverflow.com/questions/2372798/event-handling-order
Pointy :

Events bubble \"up\" the DOM tree, so if you've got handlers for an element and its parent, the child element handler will be called first.\n\nIf you register more than one handler for an event on a single DOM element (like, more than one \"click\" handler for a single button), then the handlers are called in the order that they were attached to the element.\n\nYour handlers can do a few things to change what happens after they're done:\n\n\nWith the passed-in event parameter, call event.preventDefault() to keep any \"native\" action from happening\ncall event.stopPropagation() to keep the event from bubbling up the DOM tree\nreturn false from the handler, to both stop propagation and prevent default\n\n\nNote that for some input elements (checkboxes, radio buttons), the handling is a little weird. When your handler is called, the browser will have already set the checkbox \"checked\" value to the opposite of its former value. That is, if you have a checkbox that is not checked, then a \"click\" handler will notice that the \"checked\" attribute will be set to \"true\" when it is called (after the user clicks). However, if the handler returns false, the checkbox value will actually NOT be changed by the click, and it will remain un-checked. So it's like the browser does half of the \"native\" action (toggling the element \"checked\" attribute) before calling the handler, but then only really updates the element if the handler does not return false (or call \"preventDefault()\" on the event object).",
2010-03-03T16:04:37
yy