2012-04-03 18 views
6

Digamos que tenemos muchas cosas para hacer. Utilizamos $('body').on('click', '.todo', do_stuff) en lugar de $('.todo').click(do_stuff), por lo que solo adjuntaremos un detector de eventos al DOM.¿Hay dos eventos igual jQuery .on enlazados dos veces?

Sin embargo, estoy usando un MVC pequeño. Cada vista para hacer tiene este código $('body').on('click', '.todo', do_stuff). Entonces, si tenemos 20 en dos, ¿significa eso que el cuerpo tiene 20 en los oyentes conectados o solo uno? ¿Todos ellos dispararán?

+0

Puede enlazar múltiples oyentes de eventos al mismo elemento y todos ellos pueden dispararse. – webdevbyjoss

+0

@webdevbyjoss jQuery ... –

+0

Según su pregunta, parece que está tratando de comprender cómo funciona la construcción $ ('ddd'). Do(). Posiblemente vale la pena leer aquí: http://api.jquery.com/on/ – webdevbyjoss

Respuesta

5

Usted debe matar al anterior gestor de eventos:

<script> 
    $('body').off('click','.todo', do_stuff); 
    $('body').on('click', '.todo', do_stuff); 
</script> 

incluyendo la función de controlador de eventos reales en la función off(), se solo elimine ese controlador específico, y no todos los demás activados por los mismos elementos/eventos. Además, evite las funciones anónimas mientras hace esto.

Actualmente también se sugiere abandonar unbind() y kill(). on()/off() debe adaptarse a todas sus necesidades de manejo de eventos, incluidos los enlaces diferidos en vivo futuros y los resultados diferidos.

+0

Por cierto, yo uso el espacio de nombres para funciones anon. 'click.yepdido' – CamelCamelCamel

+0

¡Entonces estás listo! ;) – keystorm

+0

También le puede interesar '.one()', que se desvincula después del primer evento. Varios archivos adjuntos '.one()' aún generarán varias llamadas al manejador, por lo que '.off()' aún es necesario. – keystorm

4

Si ejecuta ese código veinte veces, terminará con veinte controladores de eventos vinculados; y sí, todos dispararán.

+0

¡Eso es terrible! – CamelCamelCamel

+0

que es una característica! use unbind() para eliminar los detectores de eventos que ya no necesita – webdevbyjoss

2

Significa que body tiene 1 oyente que inspecciona todos los eventos de clics y comprueba la estructura DOM del destino del evento para ver si contenía un elemento .todo.

Solo habrá 1 oyente en el cuerpo, independientemente de cuántos elementos .todo tenga.

Ejemplo (código bruto, ignorar manejador de listas, etc.):

<script> 
    $('body').on('click', '.todo', myFunc); 
    // results in 1 handler on the Body, which will be called when each .todo element is clicked 
</script> 

<body> 
    <div class="todo">Foo</div> 
    <div class="todo">Bar</div> 
    <div class="todo">Baz</div> 
</body> 
+0

um, hay una respuesta contradictoria, por lo que un violín o fuente será bueno – CamelCamelCamel

+0

sí http://jsfiddle.net/kSAqM/ – CamelCamelCamel

Cuestiones relacionadas