2012-04-28 18 views
13
elemen.addEventListener('click',func,false); 
elemen.addEventListener('click',func,false); 

¿Se llamará al func dos veces al hacer clic en elemen?¿Funcionará el mismo addEventListener?

En caso afirmativo ... ¿Hay una solución para verificar si el mismo detector de eventos existe en elemen?

Respuesta

23

funcno llamarse dos veces al hacer clic, no; pero sigue leyendo para obtener más detalles y un "gotcha".

De addEventListener en la especificación:

Si múltiple idénticos EventListeners están registrados en el mismo EventTarget con los mismos parámetros de los casos duplicados se descartan. Ellos no hacen que se llame al EventListener dos veces y, dado que se descartan, no es necesario eliminarlos con el método removeEventListener.

(el subrayado es mío)

He aquí un ejemplo:

var target = document.getElementById("target"); 
 

 
target.addEventListener("click", foo, false); 
 
target.addEventListener("click", foo, false); 
 

 
function foo() { 
 
    var p = document.createElement("p"); 
 
    p.innerHTML = "This only appears once per click, but we registered the handler twice."; 
 
    document.body.appendChild(p); 
 
}

Es importante señalar, sin embargo, que tiene que ser la misma función , no solo una función que hace lo mismo. Por ejemplo, aquí estoy conectando cuatro funciones separadas al elemento, todos los cuales se llamará:

var target = document.getElementById("target"); 
 

 
var count; 
 
for (count = 0; count < 4; ++count) { 
 
    target.addEventListener("click", function() { 
 
    var p = document.createElement("p"); 
 
    p.innerHTML = "This gets repeated."; 
 
    document.body.appendChild(p); 
 
    }, false); 
 
}
<input type="button" id="target" value="Click Me">

Eso es porque en cada repetición del bucle, se crea una función diferente (aunque el código es el mismo).

+0

No soy el OP, pero esta respuesta también me ayudó mucho. Gracias !! –