Order of event handling in JavaScript

Question

I am having a small problem with event handling order in JavaScript.

Supposed I have this:

targetElement.addEventListener('click', doSomething1, true)
targetElement.addEventListener('click', doSomething2, false)

Then doSomething1 will be called first then doSomething2.

But if I reverse them:

targetElement.addEventListener('click', doSomething2, false)
targetElement.addEventListener('click', doSomething1, true)

Then doSomething2 will get called first.

Does this mean, for target element, the third parameter is meaningless? because it is in target phase? (I thought doSomething1 will always be called first since it sets capture phase to be true)

Thanks

This may help: http://www.quirksmode.org/js/events_order.html#link4 — Dave, Oct 21 '15 at 21:23
Possible duplicate of http://stackoverflow.com/questions/5143817/javascript-event-handler-order — Robert E, Oct 21 '15 at 21:57

score 2 · Accepted Answer · answered Oct 21 '15 at 21:46

From MDN:

Note: For event listeners attached to the event target; the event is in the target phase, rather than capturing and bubbling phases. Events in the target phase will trigger all listeners on an element regardless of the useCapture parameter.

So yes, you are correct. For the target element, the third param has no effect.

Order of event handling in JavaScript

1 Answers1