2009-03-16 18 views
43

Tengo dos funciones vinculadas a un evento de clic en dos momentos diferentes (usando jQuery). El orden en el que son despedidos es significativo. Están disparando en el orden correcto. El problema es que, cuando la primera función devuelve falso, ¡la segunda función sigue disparando!jQuery Controladores de eventos múltiples: ¿cómo cancelar?

¿Cómo puedo cancelar correctamente el evento?

código Ejemplo:

$(document).click(function() { 
    alert('a'); 
    return false; 
}); 

$(document).click(function() { 
    alert('b'); 
}); 

seguirá viendo la "b" mensaje de alerta al hacer clic en la página. ¡Esto es inaceptable!

Respuesta

82

utilizar la función stopImmediatePropagation del objeto de evento jQuery.

Evita que se ejecuten el resto de los controladores. Este método también detiene el burbujeo llamando a event.stopPropagation().

$(document).click(function(event) { 
    alert('a'); 
    event.stopImmediatePropagation(); 
    return false; 
}); 

$(document).click(function() { 
    alert('b'); 
}); 
+1

Es posible que desee tener en cuenta que debe utilizar jQuery versión 1.3 y superior para que esto funcione. –

+0

¿qué pasa con $ (documento) .on ("touchstart click", ".myelement", función (e) {e.stopImmediatePropagtion(); // ejecuta la función aquí}) ... Si el touchstart se dispara primero en la tableta ¿cancelará el clic de disparar si mantengo mi dedo presionado? – Alex

1

¿Usar ayuda para desvincular?

$(document).click(function() { 
    alert('a'); 
    $(this).unbind('click'); 
    return false; 
}); 
+3

Todavía necesito que se dispare mi segundo evento cuando la primera función NO devuelve falso. ¿No se destrabará literalmente "desvincularlo"? –

+0

sí. probablemente no sea una gran solución en general ... – nickf

+0

puede fusionar mi solución con la solución de nickf y obtendrá su comportamiento :) – fmsf

0

Si lo nickf dicho no funciona, se puede usar una pequeña máquina de estados:

var trigger = 0; 

$(document).click(function() { 

    alert('a'); 
    if(you_want_to_return_false) { 
    trigger = 1; 
    return false; 
    } 
}); 

$(document).click(function() { 
    if(trigger !== 0) { 
    alert('b'); 
    } 
    trigger = 0; 
}); 

No es la solución más bonita, pero va a trabajar.

+0

bueno, mi idea * funciona * es solo que se rompe al mismo tiempo. +1 por esta idea sin embargo. – nickf

+0

Este método se rompe exactamente de la misma manera que el otro, excepto con más código. Corrígeme si estoy equivocado. –

+0

lo siento, déjame rehacerlo – fmsf

2

Lo primero que pregunto es: ¿por qué tiene dos funciones vinculadas al mismo evento de clic? Al tener acceso al código, ¿por qué no haces esa sola llamada?

$(function(){ 
    var callbackOne = function(e){ 
     alert("I'm the first callback... Warning, I might return false!"); 
     return false; 
    }; 

    var callbackTwo = function(e){ 
     alert("I'm the second callback"); 
    }; 

    $(document).click(function (e){ 
     if(callbackOne(e)){ 
      callbackTwo(e); 
     } 
    }); 
}); 
+4

Organización. Hay un montón de código Javascript en esta aplicación, y se divide en varios archivos. De esta forma, cada página solo descarga lo que sea necesario, lo que da como resultado tiempos de carga rápidos. Tengo un controlador HTTP que los combina, los comprime y los almacena en caché también, de modo que todos se obtienen en una solicitud. –

+0

Ok. Entonces, ¿realmente existe la necesidad de -1? Solo trato de ayudar ... Su explicación es suficiente para dejarnos saber que no es la solución * para usted *. – Seb

+1

No lo hice -1, amigo! –

2

Gracias, desenlaza obras para la redefinición de funciones.

$(document).ready(function(){ 
     $("#buscar_mercaderia").click(function(){ alert('Seleccione Tipo de mercaderia'); 
    }); 
$(".tipo").live('click',function(){ 
      if($(this).attr('checked')!=''){ 
       if($(this).val()=='libro'){ 
        $("#buscar_mercaderia").unbind('click'); 
        $("#buscar_mercaderia").click(function(){ window.open('buscar_libro.php','Buscar Libros', 'width=800,height=500'); }); 
       }else if($(this).val()=='otra'){ 
        $("#buscar_mercaderia").unbind('click'); 
        $("#buscar_mercaderia").click(function(){ window.open('buscar_mercaderia.php','Buscar Mercaderias', 'width=800,height=500'); }); 
       } 
      } 
     }) 
Cuestiones relacionadas