¿Hay alguna diferencia entre llamar a event.stopImmediatePropagation() y return false dentro de un controlador de eventos?
Sí, son diferentes.
return false es básicamente lo mismo que llamar a event.stopPropagation() y event.preventDefault() .
Mientras que event.stopImmediatePropagation() es lo mismo que event.stopPropagation() además de evitar que se ejecuten otros controladores de eventos registrados en el mismo elemento. Por lo tanto, no impide la acción predeterminada para un evento, como seguir un enlace en el que se hizo clic.
En breve:
stop | prevent | prevent "same element" bubbling | default action | event handlers return false Yes Yes No preventDefault No Yes No stopPropagation Yes No No stopImmediatePropagation Yes No Yes return false también funciona en controladores de eventos de JavaScript "normales"
event.stopPropagation() y event.preventDefault() también funcionan en controladores de eventos de JavaScript "normales" (en un navegador compatible con W3C), mientras que event.stopImmediatePropagation() es una extensión de jQuery ( actualización: aparentemente es parte del nivel DOM 3 Especificación de eventos ).
Nota: return false no evita que el evento aparezca en los controladores de eventos "normales" (no jQuery) (consulte esta respuesta ) (pero aún evita la acción predeterminada).
Tal vez valga la pena leer:
Aquí está la demostración completa de return false , preventDefault , stopPropagation y stopImmediatePropagation :
var kid = document.getElementsByTagName('button')[0]; var dad = document.getElementsByTagName('div')[0]; kid.addEventListener('click', function(e) { console.log('kid here'); e.stopImmediatePropagation(); }); kid.addEventListener('click', function(e) { console.log('neighbour kid here'); }); dad.addEventListener('click', function(e) { console.log('dad here'); }); dad.addEventListener('click', function(e) { console.log('neighbour dad here'); }); <div> <button>press</button> </div>(También disponible en JSFiddle ).
La tabla en la respuesta de manwal no es completamente correcta.
stop | prevent | prevent bubbling | default action | event handlers | | Same Element | Parent Element return false Yes Yes No No preventDefault No Yes No No stopPropagation Yes No No Yes stopImmediatePropagation Yes No Yes **Yes**