2012-04-23 15 views
27

Por ejemplo, digamos que tengojQuery: ¿Agregar un oyente de evento sobrescribe el oyente anterior del mismo evento?

$(element).on('click', function() {/*Some Stuff*/}); 

definido en alguna parte, y más tarde quiero añadir más características a ese mismo evento de clic. Si hago

$(element).on('click', function() {/*Other Stuff*/}); 

voluntad "Otras Cosas" sobreescritura "Algunas cosas"?

+0

echar un vistazo aquí http://stackoverflow.com/questions/891989/javascript-adding-an-onclick-handler-without-overwriting-the-existing-one –

+1

por qué el downvotes? La pregunta es clara y concisa. –

+0

Lol, no quería escribir el código a ciegas sin saber si este era el caso. Edité mi pregunta para que tuviera más sentido. – trusktr

Respuesta

20

El segundo oyente no anulará el primero. Los manejadores de eventos jQuery se agregan de forma acumulativa y se ejecutan en el orden en que se adjuntaron.

Lo que hace efecto si un controlador impide que la otra correr es la forma en la función cancela controlador de clic por defecto del navegador (es decir, cómo se detiene el navegador siguiendo el URL del enlace)

Si utiliza el método tradicional:

$(element).on('click', function() { 

    /* Some Stuff, do your thing */ 

    return false; 
}); 

El controlador anterior detendrá el evento y se propagará a otros controladores.

Pero puede detener la acción del evento sin detener su propagación o el manejador:

$(element).on('click', function(e) { 

    // prevent the default action at first, just to make it clear :) 
    e.preventDefault(); 

    /* do your thing */ 

    return /* what you want */; 
}); 

Esto asegurará que la acción predeterminada clic no se produce, sino que el evento sigue a otros hanlders. El evento jQuery también tiene algún otro útil event propagation methods (por ejemplo, Event.stopPropagation()) que vale la pena conocer.

+1

¡Oh! Eso lo explica. Siempre me pregunté por qué molestarse en usar .preventDefault() ... Ahora lo sé. – trusktr

+0

¿Qué sucede si agrega la misma devolución de llamada exactamente dos veces? por ejemplo: 'jQuery (ventana) .on (" scroll, MyClass.scroll ")'. Hay una prueba para eso? (Supongo que podría mirar. Suspiro) –

1

Has malentendido; agregar otro controlador no sobrescribe el primero.

ver este jsFiddle: http://jsfiddle.net/ymuBs/

Al hacer clic en el enlace escribe "uno" a la consola. Al hacer clic en el botón se agrega otro controlador al enlace. Ahora al hacer clic en el enlace escribe "uno" y "dos" en la consola:

4

No, no lo hará. on() es como bind: agrega el evento a $.data("events")

Sin embargo, puede eliminar cosas explícitamente a través de off().

0

Esto ya ha sido respondido, pero pensé que agregaría cómo normalmente abordo este problema cuando estoy en una situación en la que podría hacer que un oyente de clic se duplicara.

acabo de consulta del usuario en y fuera métodos ...

$ (elemento).apagado ('clic'); // elimina un oyente añadido previamente clic mediante el

$ (elemento) .en en método ('clic', function() {/ Algunas cosas /}); // Suma de nuevo y sólo se ejecuta una vez

http://api.jquery.com/off/

El método .OFF() elimina los controladores de eventos que estaban conectados con .on(). Consulte la discusión de los eventos delegados y directamente vinculados en esa página para obtener más información. Llamar .off() sin argumentos elimina todos los controladores asociados a los elementos. Los controladores de eventos específicos se pueden eliminar en los elementos al proporcionar combinaciones de nombres de eventos, espacios de nombres, selectores o nombres de funciones del manejador. Cuando se proporcionan varios argumentos de filtrado, todos los argumentos proporcionados deben coincidir para que se elimine el controlador de eventos.

+0

Esto en realidad no responde la pregunta. Simplemente da una técnica sugerida. La pregunta ya fue respondida claramente. En este juego de preguntas, normalmente respondes la pregunta de una manera nueva o avisas que estás proporcionando información adicional que no se proporcionó, si deseas los votos ascendentes. – joshp

+0

buen punto Josh, no estaba buscando ninguna clasificación. Me encontré con esto mientras investigaba este tema y pensé que otras personas también querrían saberlo ... –

+0

Entendido. Solo publiqué un comentario porque pareces nuevo en el sitio. – joshp