Pourquoi l'événement `onclick` de ma balise JS `li` ne fonctionne-t-il pas dans IE8 et comment puis-je y remédier ?

L'événement JS li Tag Onclick ne fonctionne pas dans IE8

Le problème signalé avec l'événement li onclick qui ne fonctionne pas dans les navigateurs IE8 provient du fait que IE8 ne prend pas en charge la méthode addEventListener. Pour résoudre ce problème, nous devons utiliser son prédécesseur non standard, attachEvent.

Implémentation du hook attachEvent

La fonction hookEvent suivante peut être utilisée pour gérer les événements dans les deux cas. navigateurs conformes aux standards et ceux dotés du précédent mécanisme spécifique à Microsoft :

var hookEvent = (function() {
    var div;

    function standardHookEvent(element, eventName, handler) {
        element.addEventListener(eventName, handler, false);
        return element;
    }

    function oldIEHookEvent(element, eventName, handler) {
        element.attachEvent("on" + eventName, function(e) {
            e = e || window.event;
            e.preventDefault = oldIEPreventDefault;
            e.stopPropagation = oldIEStopPropagation;
            handler.call(element, e);
        });
        return element;
    }

    function oldIEPreventDefault() {
        this.returnValue = false;
    }

    function oldIEStopPropagation() {
        this.cancelBubble = true;
    }

    div = document.createElement('div');
    if (div.addEventListener) {
        div = undefined;
        return standardHookEvent;
    }
    if (div.attachEvent) {
        div = undefined;
        return oldIEHookEvent;
    }
    throw "Neither modern event mechanism (addEventListener nor attachEvent) is supported by this browser.";
})();

Intégrer le Hook dans Gestion des événements

Pour utiliser ce hook dans l'exemple fourni, nous remplaçons la ligne addEventListener par :

hookEvent(document.getElementById("hd_vertical"), "click", function(e) {
    // Event handling code
});

Considérations supplémentaires

IE8 ne prend pas non plus en charge getElementsByClassName. Pour compenser, nous pouvons utiliser querySelectorAll ou querySelector à la place :

var _url = document.querySelectorAll("." + id)[1].getAttribute('href'); // Grabs the second matching element
var _url = document.querySelector("." + id).getAttribute('href'); // Grabs the first matching element

En exploitant la fonction hookEvent et en résolvant ces problèmes supplémentaires de compatibilité du navigateur IE8, l'événement li onclick devrait désormais fonctionner comme prévu.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!