addEventListener no funciona en IE8

Question

He creado una casilla de verificación dinámicamente. He usado addEventListener para llamar a una función al hacer clic en la casilla de verificación, que funciona en Google Chrome y Firefox, pero no funciona en Internet Explorer 8. Este es mi código:

var _checkbox = document.createElement("input"); 
_checkbox.addEventListener("click", setCheckedValues, false); 

setCheckedValues es mi controlador de eventos.

Answer 1

Probar:

if (_checkbox.addEventListener) { 
    _checkbox.addEventListener("click", setCheckedValues, false); 
} 
else { 
    _checkbox.attachEvent("onclick", setCheckedValues); 
} 

actualización :: Para las versiones de Internet Explorer anteriores a IE9, attachEvent método debe utilizarse para registrar el detector especificado a la EventTarget se llama en adelante, para otros addEventListener debe ser utilizado.

Answer 2

Tienes que usar attachEvent en las versiones de IE anteriores a IE9. Detectar si se define addEventListener y utilizar attachEvent si no lo es:

if(_checkbox.addEventListener) 
    _checkbox.addEventListener("click",setCheckedValues,false); 
else 
    _checkbox.attachEvent("onclick",setCheckedValues); 
//       ^^ -- onclick, not click 

Tenga en cuenta que IE11 will remove attachEvent.

Consulte también:

• MDN: element.addEventListener: Legacy Internet Explorer and attachEvent
• MSDN: attachEvent method

Answer 3

Si utiliza jQuery se puede escribir:

$(_checkbox).click(function(e){ /*process event here*/ }) 

Answer 4

Mayb es más fácil (y tiene más rendimiento) si delegar la gestión de eventos a otro elemento, por ejemplo, su mesa de

$('idOfYourTable').on("click", "input:checkbox", function(){ 

}); 

de esta manera va a tener un solo controlador de eventos, y esto va a funcionar también para los elementos recién agregados Esto requiere jQuery> = 1,7

De lo contrario usar delegado()

$('idOfYourTable').delegate("input:checkbox", "click", function(){ 

}); 

Answer 5

IE no soporta addEventListener hasta la versión 9, así que hay que utilizar attachEvent, he aquí un ejemplo:

if (!someElement.addEventListener) { 
    _checkbox.attachEvent("onclick", setCheckedValues); 
} 
else { 
    _checkbox.addEventListener("click", setCheckedValues, false); 
} 

Answer 6

Esto también es una solución simple de navegador:

var addEvent = window.attachEvent||window.addEventListener; 
var event = window.attachEvent ? 'onclick' : 'click'; 
addEvent(event, function(){ 
    alert('Hello!') 
}); 

En lugar de 'haga clic en 'puede ser cualquier evento, por supuesto.

Answer 7

puede utilizar la función el siguiente addEvent() para añadir eventos para la mayoría de las cosas, sino en cuenta que para XMLHttpRequest if (el.attachEvent) fallará en IE8, ya que no es compatible con XMLHttpRequest.attachEvent() lo que tiene que utilizar XMLHttpRequest.onload = function() {} lugar.

function addEvent(el, e, f) { 
    if (el.attachEvent) { 
     return el.attachEvent('on'+e, f); 
    } 
    else { 
     return el.addEventListener(e, f, false); 
    } 
} 

var ajax = new XMLHttpRequest(); 
ajax.onload = function(e) { 
} 

Answer 8

he optado por un Polyfill rápido basado en las respuestas anteriores:

//# Polyfill 
window.addEventListener = window.addEventListener || function (e, f) { window.attachEvent('on' + e, f); }; 

//# Standard usage 
window.addEventListener("message", function(){ /*...*/ }, false); 

Por supuesto, al igual que las respuestas anteriores esto no asegura que window.attachEvent existe, que puede o no ser un problema.

Answer 9

if (document.addEventListener) { 
    document.addEventListener("click", attachEvent, false); 
} 
else { 
    document.attachEvent("onclick", attachEvent); 
} 
function attachEvent(ev) { 
    var target = ev.target || ev.srcElement; 
    // custom code 
}