首頁 > web前端 > js教程 > 主體

為什麼我的 JS `li` 標籤的 `onclick` 事件在 IE8 中不起作用,如何修復?

Barbara Streisand
發布: 2024-11-28 02:14:10
原創
255 人瀏覽過

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

JS li 標籤Onclick 事件在IE8 中無法運作

報告的li onclick 事件在IE8 瀏覽器中無法運作的問題源自於瀏覽器中無法運作的問題源自於瀏覽器中無法運作的問題源自於瀏覽器中無法運作的問題源自於瀏覽器中無法運作的問題源自於瀏覽器中無法運作的問題源自於瀏覽器中無法運作的問題事實上IE8不支援addEventListener方法。為了解決這個問題,我們需要利用它的非標準前身,attachEvent。

實作attachEvent Hook

以下hookEvent函數可用於處理兩者中的事件符合標準的瀏覽器以及具有先前 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.";
})();
登入後複製

整合掛鉤事件處理

要在提供的範例中使用此掛鉤,我們將addEventListener 行替換為:

hookEvent(document.getElementById("hd_vertical"), "click", function(e) {
    // Event handling code
});
登入後複製

其他注意事項

IE8 也缺乏對 getElementsByClassName 的支援。作為補償,我們可以使用 querySelectorAll 或 querySelector 來代替:

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
登入後複製

透過利用 hookEvent 函數並解決這些額外的 IE8 瀏覽器相容性問題,li onclick 事件現在應該按預期運行。

以上是為什麼我的 JS `li` 標籤的 `onclick` 事件在 IE8 中不起作用,如何修復?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板