delegate - Cómo evitar otros manejadores de eventos, desde el primer controlador, en jQuery

jquery methods

Question

Si adjunta dos o más controladores de eventos a un elemento HTML, se ejecutarán uno después del otro. Sin embargo, si desea detener los controladores de eventos posteriores, en función de una condición marcada en el primer controlador, ¿qué debe hacer?

Por ejemplo:

<div id=''target''>
</div>

<p id=''result''>
</p>

Me gustaría cancelar el segundo controlador, si se cancela el primer controlador.

$(function() {
    var target = $(''#target''),
        result = $(''#result'');
    target.click(function(e) {
        result.append(''first handler<br />'');
        // Here I want to cancel all subsequent event handlers
    });
    target.click(function(e) {
        result.append(''second handler<br />'');
    });
});

Puedes ver el violín here .

PD: Sé que e.preventDefault() impide la acción predeterminada del elemento HTML (por ejemplo, evitar que se envíe una solicitud HTTP GET debido al clic en un enlace), y e.preventPropagation() hace que el evento se propague a sus elementos padres en el árbol DOM. También sé que es posible usar una variable del medio, establecerla en verdadero en el administrador de primera mano y verificarla en los controladores posteriores. Pero quiero ver si hay una solución más clara y sofisticada para este problema o no.

Answer 1

Consulte event.stopImmediatePropagation() - http://api.jquery.com/event.stopImmediatePropagation/

De acuerdo con los documentos jQuery API, este método:

Evita que se ejecute el resto de los controladores y evita que el evento burbujee en el árbol DOM.

Answer 2

La solución es específica del navegador. Ver dojo.stopEvent :

dojo.stopEvent = function(/*Event*/ evt){
    // summary:
    //        prevents propagation and clobbers the default action of the
    //        passed event
    // evt: Event
    //        The event object. If omitted, window.event is used on IE.
    if(has("dom-addeventlistener") || (evt && evt.preventDefault)){
        evt.preventDefault();
        evt.stopPropagation();
    }else{
        evt = evt || window.event;
        evt.cancelBubble = true;
        on._preventDefault.call(evt);
    }
};

Fiddle actualizado: http://jsfiddle.net/pFp7P/1/