javascript - pagina - jquery get attribute data

jQuery: más de un controlador para el mismo evento

Question

¿Qué sucede si unigo dos manejadores de eventos al mismo evento para el mismo elemento?

Por ejemplo:

var elem = $("...")
elem.click(...);
elem.click(...);

¿El último controlador "gana" o se ejecutarán ambos manejadores?

Answer 1

Ambos manejadores se ejecutarán, el modelo de eventos jQuery permite múltiples manejadores en un elemento, por lo tanto, un manejador posterior no anula un manejador anterior.

Los manejadores ejecutarán en el orden en que estaban atados .

Answer 2

Ambos manejadores son llamados.

Puede estar pensando en el enlace de eventos en línea (por ejemplo, "onclick=..." ), donde un gran inconveniente es que solo se puede configurar un controlador para un evento.

jQuery cumple con el modelo de registro de eventos DOM Nivel 2 :

El modelo de eventos de DOM permite el registro de múltiples oyentes de eventos en un único EventTarget. Para lograr esto, los detectores de eventos ya no se almacenan como valores de atributo

Answer 3

Debería poder usar el encadenamiento para ejecutar los eventos en secuencia, por ejemplo:

$(''#target'')
  .bind(''click'',function(event) {
    alert(''Hello!'');
  })
  .bind(''click'',function(event) {
    alert(''Hello again!'');
  })
  .bind(''click'',function(event) {
    alert(''Hello yet again!'');
  });

Creo que el siguiente código está haciendo lo mismo

$(''#target'')
      .click(function(event) {
        alert(''Hello!'');
      })
      .click(function(event) {
        alert(''Hello again!'');
      })
      .click(function(event) {
        alert(''Hello yet again!'');
      });

Fuente: http://www.peachpit.com/articles/article.aspx?p=1371947&seqNum=3

http://api.jquery.com/bind/ también dice:

Cuando un evento llega a un elemento, se activan todos los controladores vinculados a ese tipo de evento para el elemento. Si hay varios manejadores registrados, siempre se ejecutarán en el orden en que estaban vinculados. Después de que todos los manejadores se hayan ejecutado, el evento continúa a lo largo de la ruta de propagación del evento normal.

Answer 4

Existe una solución alternativa para garantizar que un manejador suceda después de otro: conecte el segundo manejador a un elemento contenedor y deje que el evento se active. En el controlador adjunto al contenedor, puede mirar event.target y hacer algo si es el que le interesa.

Crudo, tal vez, pero definitivamente debería funcionar.

Answer 5

Lo hizo funcionar con éxito usando los 2 métodos: encapsulación de Stephan202 y múltiples oyentes de eventos. Tengo 3 pestañas de búsqueda, definamos su ID de entrada de texto en una matriz:

var ids = new Array("searchtab1", "searchtab2", "searchtab3");

Cuando el contenido de searchtab1 cambia, quiero actualizar searchtab2 y searchtab3. Lo hizo de esta manera para la encapsulación:

for (var i in ids) {
    $("#" + ids[i]).change(function() {
        for (var j in ids) {
            if (this != ids[j]) {
                $("#" + ids[j]).val($(this).val());
            }
        }
    });
}

Múltiples oyentes de eventos:

for (var i in ids) {
    for (var j in ids) {
        if (ids[i] != ids[j]) {
            $("#" + ids[i]).change(function() {
                $("#" + ids[j]).val($(this).val());
            });
        }
    }
}

Me gustan ambos métodos, pero el programador eligió la encapsulación, sin embargo, múltiples oyentes de eventos también funcionaron. Usamos Chrome para probarlo.

Answer 6

Supongamos que tiene dos manejadores, f y g , y quiere asegurarse de que se ejecuten en un orden conocido y fijo, y luego simplemente encapsularlos:

$("...").click(function(event){
  f(event);
  g(event);
});

De esta manera, existe (desde la perspectiva de jQuery) solo un manejador, que llama a f y g en el orden especificado.

Answer 7

jQuery''s .bind () dispara en el orden en que estaba vinculado :

Cuando un evento llega a un elemento, se activan todos los controladores vinculados a ese tipo de evento para el elemento. Si hay varios manejadores registrados, siempre se ejecutarán en el orden en que estaban vinculados. Después de que todos los manejadores se hayan ejecutado, el evento continúa a lo largo de la ruta de propagación del evento normal.

Fuente: http://api.jquery.com/bind/

Debido a que las otras funciones de jQuery (por ejemplo, .click() ) son accesos directos para .bind(''click'', handler) , supongo que también se desencadenan en el orden en que están vinculadas.