Question

I know that stopPropagation() prevents the event from reaching the DOM elements that wrap the current element. Does it also prevent this event from being delivered to other handlers on the same element?

To give an example, I have my own click handler defined on an element. In addition I am also using this jQuery Context Menu plugin which handles a mousedown+(testbutton == 2)+mouseup and uses stopPropagation() after mouse(up|down) and this seems to disable my click handlers. If I comment these two calls in the plugin source, my click handlers and the context menu work correctly. This seems to suggest that stopPropagation() and stopImmediatePropgation() do the same thing. Is my understanding correct?

Answer 1

The stopPropagation doesn’t stop other handlers of the same event, but in this specific case it does. If you use it in the mousedown event, it will prevent the click event.

Demo: http://jsfiddle.net/v6ges/

$('div').mousedown(function(e){ alert(0); e.stopPropagation(); });
$('div').click(function(e){ alert(1); e.stopPropagation(); });
$('div').click(function(e){ alert(2); e.stopPropagation(); });

Only the mousedown event is triggered. If you comment out the mousedown event binding, both of the click events are triggered.