Question

Drawing off the explanation provided in this example，我将以下代码添加到我的html中，作为立即调用的函数表达式的一部分：

(function hideOverlayOnEsc(){
    document.addEventListener('keydown', function(e){
        if( e.keyCode == '27' ){
            cmnOverlayV2.hideOverlay();
        }
    }, false);

    // IE8 Fix
    if(!document.addEventListener){ 
        document.attachEvent("onkeydown", function(e){
            if( e.keyCode == '27' ){
                cmnOverlayV2.hideOverlay();
            }
        });
    }
})();

当单独使用将这两个版本的事件监听器应用于文档时，它们按预期工作。也就是说，如果删除了IE8 fix，则代码可以在其他浏览器中正常运行。如果addEventListener代码块被删除，它在IE8中正常工作。但是，对于这两个浏览器类别中的至少一个（即8＆amp; not ie8），同时使用这两个代码块会以某种方式打破html

其他一些参考信息：

使用了document对象，因为应该隐藏在Escape上的实际html元素最初不会加载到DOM中，这是一种简单的方法。

此代码块正常运行（当省略两个内部代码块之一时）作为内联<script>调用或外部.js文件的调用。

此代码块所在的html被注入另一个html文档的DOM中。换句话说，我正在使用的只是动态添加的整个页面的一部分。因此，当我说html被“破坏”时实际发生的是我正在编辑的html不存在于父html文档的DOM中。

我曾考虑设置条件评论来说明之类的内容，但这很难，因为我无法访问父html的<head>部分。如果可能的话，我宁愿在hideOverlayOnEsc()函数中解决这个问题。

Answer 1

你复制错了。仔细查看this答案。你的代码必须是这样的：

(function hideOverlayOnEsc(){
    // IE8 Fix
    if(document.addEventListener){ 
        document.addEventListener('keydown', function(e){
            if( e.keyCode == '27' ){
                cmnOverlayV2.hideOverlay();
            }
        }, false);
    } else {
        document.attachEvent("onkeydown", function(e){
            if( e.keyCode == '27' ){
                cmnOverlayV2.hideOverlay();
            }
        });
    }
})();

addEventListener的IE8回退会破坏现代浏览器的代码

1 个答案: