ホームページ > ウェブフロントエンド > jsチュートリアル > 「onClick」イベント リスナーが IE8 で動作しないのはなぜですか?どうすれば修正できますか?

「onClick」イベント リスナーが IE8 で動作しないのはなぜですか?どうすれば修正できますか?

Patricia Arquette
リリース: 2024-11-28 08:44:14
オリジナル
610 人が閲覧しました

Why Doesn't My `onClick` Event Listener Work in IE8, and How Can I Fix It?

IE8 onClick イベント リスナーの互換性の問題

問題:
提供されたコードでは、JavaScript イベント リスナーli 要素は IE8 では機能しないためbrowser.

解決策:

IE8 には addEventListener メソッドがないため、代替のブラウザ間イベント処理ソリューションが必要です。次のコードは、標準ブラウザと従来のブラウザの両方で動作する addEventListener のポリフィルを提供します。

var hookEvent = (function() {
    var div;

    // Standard-compliant browsers
    function standardHookEvent(element, eventName, handler) {
        element.addEventListener(eventName, handler, false);
        return element;
    }

    // Legacy IE browsers
    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.";
})();
ログイン後にコピー

使用法:
提供されたコードで、 getElementById().addEventListener( ) で呼び出します:

hookEvent(document.getElementById("hd_vertical"), "click", function(e) {
   // ...
});
ログイン後にコピー

追加注:

  • IE8 も getElementsByClassName をサポートしていません。代わりに querySelectorAll を使用してください。
  • 提供されたポリフィルは一部のイベント プロパティを正規化しますが、すべてではありません。包括的なイベント処理には、jQuery などのライブラリの使用を検討してください。

以上が「onClick」イベント リスナーが IE8 で動作しないのはなぜですか?どうすれば修正できますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート