Heim >Web-Frontend >js-Tutorial >Warum funktioniert das „onclick'-Ereignis meines JS-„li'-Tags in IE8 nicht und wie kann ich es beheben?

Warum funktioniert das „onclick'-Ereignis meines JS-„li'-Tags in IE8 nicht und wie kann ich es beheben?

Barbara Streisand
Barbara StreisandOriginal
2024-11-28 02:14:10337Durchsuche

Why Doesn't My JS `li` Tag's `onclick` Event Work in IE8, and How Can I Fix It?

JS li Tag Onclick-Ereignis funktioniert in IE8 nicht

Das gemeldete Problem, dass das li onclick-Ereignis in IE8-Browsern nicht funktioniert, ist darauf zurückzuführen Tatsache, dass IE8 die addEventListener-Methode nicht unterstützt. Um dieses Problem zu lösen, müssen wir seinen nicht standardmäßigen Vorgänger „attachEvent“ verwenden.

Implementierung des „attachEvent“-Hooks

Die folgende Funktion „hookEvent“ kann zur Verarbeitung von Ereignissen in beiden verwendet werden Standardkonforme Browser und solche mit dem bisherigen Microsoft-spezifischen Mechanismus:

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.";
})();

Integration des Hooks in Event Handhabung

Um diesen Hook im bereitgestellten Beispiel zu verwenden, ersetzen wir die Zeile addEventListener durch:

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

Zusätzliche Überlegungen

IE8 Es fehlt auch die Unterstützung für getElementsByClassName. Zum Ausgleich können wir stattdessen querySelectorAll oder querySelector verwenden:

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

Durch die Nutzung der HookEvent-Funktion und die Behebung dieser zusätzlichen IE8-Browser-Kompatibilitätsprobleme sollte das li onclick-Ereignis jetzt wie erwartet funktionieren.

Das obige ist der detaillierte Inhalt vonWarum funktioniert das „onclick'-Ereignis meines JS-„li'-Tags in IE8 nicht und wie kann ich es beheben?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn