addEventListener no funciona en IE8

He creado una casilla de verificación de forma dinámica. Solía addEventListenerllamar a una función al hacer clic en la casilla de verificación, que funciona en Google Chrome y Firefox pero no en Internet Explorer 8 . Este es mi codigo:

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

setCheckedValues es mi controlador de eventos.

Tratar:

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

Actualización :: Para las versiones de Internet Explorer anteriores a IE9, se debe usar el método attachEvent para registrar el oyente especificado en el EventTarget en el que se llama, para otras, se debe usar addEventListener .

Tienes que usarlo attachEventen versiones de IE anteriores a IE9. Detecta si addEventListenerestá definido y usa attachEventsi no lo está:

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

Tenga en cuenta que IE11 eliminaráattachEvent .

Ver también:

• MDN: element.addEventListenerInternet Explorer heredado y attachEvent
• MSDN: método attachEvent

Esta también es una solución simple para navegadores cruzados:

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

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

IE no es compatible addEventListenerhasta la versión 9, por lo que debe usar attachEvent, aquí hay un ejemplo:

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

Puede que sea más fácil (y tenga más rendimiento) si delega el manejo de eventos a otro elemento, por ejemplo, su tabla

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

});

de esta manera, solo tendrá un controlador de eventos, y esto también funcionará para los elementos recién agregados. Esto requiere jQuery> = 1.7

De lo contrario, use delegate ()

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

});

Puede usar la función addEvent () a continuación para agregar eventos para la mayoría de las cosas, pero tenga en cuenta que para XMLHttpRequest if (el.attachEvent)fallará en IE8, porque no es compatible, XMLHttpRequest.attachEvent()por lo que debe usar XMLHttpRequest.onload = function() {}en su 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) {
}

Opté 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 garantiza que window.attachEventexista, lo que puede ser un problema o no.

Si usa jQuery puede escribir:

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

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