Question

我开发了以下代码，它每隔x秒简单地将一个图像换成另一个图像。一切正常，Chrome中没有任何错误。但是，在IE（最新回到IE8）中，它什么都不做，没有返回错误，只停留在第一张图像上。

有什么建议吗？我记得在某处读取setInterval会导致IE中的问题。

考虑：

$(function () {
    var fElement = $('.fadein');
    fElement.find('img:gt(0)').hide();
    setInterval(function () {
        if (!fElement.data('paused')) {
            fElement.find(':first-child')
                .stop(true, true) // fixes le tabbed/hidden animation queue
                .fadeOut()
                .next('img')
                .fadeIn()
                .end()
                .appendTo('.fadein');
        } else {
            console.log('waiting...');
        }
    }, 2000);
    $('map').hover(
        function () {
            console.log('pausing');
            fElement.data('paused', 1);
        },
        function () {
            console.log('unpausing');
            fElement.data('paused', 0);
        }
    );
});
if (!console && !console.log) {
    console = {};
    console.log = function () {};
}

和CSS：

.fadein {
display: block;
height: 49px;
width: 287px;
float: left;
}
.fadein img {
position:absolute;
}
.stripContainer {
display:block;
height: 49px;
}

和HTML：

<div class="fadein">
    <img src="img1.jpg" border="0" width="287" height="49" alt="" style="" id="level2Menu"/>
    <img src="img2.jpg" border="0" width="287" height="49" alt="" style="" id="level2Menu"/>
</div>
<div class="stripContainer">
    <img src="img3.jpg" usemap="#secondM" border="0" width="385" height="49" alt="" style="float:left;" id="level2Menu"/>
    <img src="img4.jpg" usemap="#secondM" border="0" width="288" height="49" alt="" style="float:right;" id="level2Menu"/>
</div>

编辑：这个小提琴显示它在Chrome中应该如此运作：http://jsfiddle.net/8f5uU/

Answer 1

好吧，setInterval不应该在早期版本的IE中引起任何问题。但是，jQuery可能会。正如jQuery Doc:

中所述

边缘:(当前 - 1）和当前

Firefox :(当前 - 1）和当前

Internet Explorer：9 +

接着说：

如果您需要支持Internet Explorer 6-8，Opera 12.1x或Safari 5.1+等旧版浏览器，请使用jQuery 1.12。

尝试使用旧版本的jQuery，看看它是怎么回事。

JavaScript无法在IE中运行，.data？ setInterval的？

1 个答案: