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中正常工作。但是，目前，同时安装这两个代码块会以某种方式破坏两个浏览器类别(ie8 和非 ie8)中至少一个的 html
一些供引用的附加信息:
document使用对象是因为应该在 Escape 上隐藏的实际 html 元素最初不会加载到 DOM 中，这是一个简单的解决方法。
此代码块可以作为内联 <script> 正常运行(当省略两个内部代码块之一时)调用或外部.js文件的调用。
该代码块所在的 html 被注入(inject)到另一个 html 文档的 DOM 中。换句话说，我正在处理的只是动态添加的整个页面的一部分。因此，当我说 html 已“损坏”时，实际发生的是我正在编辑的 html 不存在于父 html 文档的 DOM 中。
我曾考虑过设置条件注释来表示类似 <!--[if IE8]>USE SCRIPT B<![endif]--> 的内容但这很困难，因为我无权访问 <head>父 html 的部分。我更愿意在 hideOverlayOnEsc() 内解决这个问题如果可能的话，功能。
最佳答案
你复制错了。仔细看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();
}
});
}
})();
关于javascript - addEventListener 的 IE8 回退会破坏现代浏览器的代码，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21191185/