JavaScript 导致 Internet Explorer 8 停止运行

javascript causing internet explorer 8 to stop running

本文关键字：运行 Explorer 导致 Internet JavaScript      更新时间：2023-09-26

我编写了以下代码来更改鼠标悬停图像：

<script language="Javascript">
<!--
function ShowPicture(id) {
var css = '.test1 a:hover:after{content: url(_images/recurring/'+id+'); }';
style = document.createElement('style');
if (style.styleSheet) {
    style.styleSheet.cssText = css;
} else {
    style.appendChild(document.createTextNode(css));
}
document.getElementsByTagName('head')[0].appendChild(style);
}
</script>

它在Chrome上完美运行，但是一旦IE8点击此脚本，它就会停止整个页面的轨道。 处理这个问题的最佳方法是什么？ 是否有一些等效于：if(internetexplorer8 == true(命令？还是脚本本身有缺陷，但 Chrome 允许它运行？

有一个

已知的错误与 IE 8 的 createTextNode 相关。动态添加样式表时的IE 8和7错误

由于您已经在使用 Javascript，因此通过将 CSS 引入组合来增加复杂性没有任何优势。

您基本上可以遍历所有图像，将原始源存储为图像上的数据属性，并将侦听器附加到图像以在图像和翻转之间交换。

下面的代码应该经过一些修改。

window.addEventListener('load', function(e) {
    //preload image to prevent flicker
    var imgs = document.getElementsByTagName('img');
    //loop 
    for (var i = 0; i < imgs.length; i++) {
        //add your code here to determing rollover original/replacement binding, my example is hard coded
        var rolloverSrc = 'https://farm3.staticflickr.com/2852/9704174376_b5c406c710_q.jpg';
        //preloading img into memory
        var preloadImg = document.createElement('img');
        preloadImg.src = rolloverSrc;
        //Alias varaible to keep in scope for listeners
        var img = imgs[i];
        preloadImg.addEventListener('load', function(e) {
            //Attach rollover events after image preloads
            img.addEventListener('mouseover', function(e) {
                this.setAttribute('data-orginal-src', this.src);
                this.src = rolloverSrc;
            }, false);
            img.addEventListener('mouseout', function(e) {
                var original = this.getAttribute('data-orginal-src');
                this.src = original;
            }, false);
        }, false);
    }
}, false);

你可以在这里看到它：https：//jsbin.com/juladaq/edit？js，console，output

相关文章：