delegate - jquery on input

jQuery.on() con múltiples selectores en la delegación de eventos?

Question

He utilizado .on() en jQuery 1.7 y me pregunto si es posible adjuntar varios selectores a la vez para los elementos que se han inyectado en una página. Anteriormente, estaba usando live() , pero es obvio por qué quiero cambiar dadas las mejoras de rendimiento.

¿Puedes usar .on() de la manera como:

$(document).on(''click'', ''#selector1, #selector2, .class1'', function () { 
     //stuff
});

¿Y hay beneficios perdidos al adjuntar un documento?

?

Answer 1

1. ¿Puedes usar .on () de la manera como:

   $(document).on(''click'', ''#selector1, #selector2, .class1'', function () { 
       //stuff
   });

   Sí, eso funcionará.

2. Quiero usar esto en lugar de live() dadas las mejoras de rendimiento.

   No hay ventajas de rendimiento de usar ese fragmento de código en lugar de usar live() , ya que live() enlaza los eventos con el documento, y en jQuery 1.7, las llamadas on vivo detrás de la escena.

3. ¿Y hay beneficios perdidos al adjuntar un documento?

   La desventaja de vincular a document es que el evento debe atravesar la lista completa de ancestros antes de ser manejado; Esto, como se señala en la documentación de jQuery , es la ruta más lenta posible. Será mejor manejar el evento antes, conectando el controlador a un elemento más cercano a la fuente del evento.

Answer 2

es posible y "esto" es el selector pulsado, no el documento.

es mejor que te adjuntes al elemento padre más cercano de tu selector. Al hacer clic en ''# selector1'', la burbuja de eventos hasta el elemento del controlador de eventos, aquí: documento.

Cuantas más capas, más acciones. Además, si entre el selector1 y el documento hay otro controlador de eventos de clic, se puede interceptar con event.stopPropagation(); , y nunca llegue al controlador de eventos "documento".

Puede verificar el "evento de intercepción" malicioso en este violín .