jQuery滑块- setTimeout跨浏览器故障

Question

好的，我试着创建另一个滑动条预加载图像(无论你想叫它什么)，只有两个方向按钮。我得到了我想要的动画和控制的想法是从一个教程。

(教程:如何制作自动推进幻灯片)

因此，我根据自己的需要调整了自动推进解决方案，并使一切正常工作。但是，当我试图在FF(8.0)中运行它时，我遇到了一个小问题。点击按钮后，除了动画在预设的3秒时间后继续的部分，它做了所有应该做的事情，而IE(8.0)没有问题(没有在其他浏览器中测试)。

我做错了什么?

下面是必要的代码: Html部分:

<div id=imgholder1>
    <div id="imgholder2"></div>
</div>
<div id="bwd" class="button"><</div>
<div id="fwd" class="button">></div>

jQuery/JavaScript:

var traker=0;
$(document).ready(function(){
    var numOfImages=4;
    var timeOut = null;
    (function autoAdvance(){
    $('#fwd').trigger('click',[true]);
    timeOut = setTimeout(autoAdvance,3000);     
    })();
    function preload(imgIndex,numImages){
        $("#imgholder1").css('background-image','url("'+imgIndex+'.jpg")');
        $("#imgholder2").hide(0);
        imgIndex < numImages ? imgIndex++ : imgIndex=1
        $("#imgholder2").css('background-image','url("'+imgIndex+'.jpg")');
        traker=imgIndex;
    }
    preload(1,numOfImages);
    function animate(imgIndex,numImages){
        $("#imgholder2").fadeIn("slow",function(){
            preload(imgIndex,numImages);
        });
    }
    $("#fwd").bind("click",function(e,simulated){
        animate(traker,numOfImages);
        if(!simulated){
            clearTimeout(timeOut);
            timeOut = setTimeout(autoAdvance,3000);
        }
    });
    $("#bwd").bind("click",function(){
        var temp=traker-2;
        if(temp == 0){temp=numOfImages;}
        if(temp == -1){temp=numOfImages-1;}
        $("#imgholder2").css('background-image','url("'+temp+'.jpg")');
        animate(temp,numOfImages);
        clearTimeout(timeOut);
        timeOut = setTimeout(autoAdvance,3000);
    });
});

Answer 1

乍一看，你的timeout变量似乎在错误的范围内-声明它在所有内容之外，以便它在函数之间共享:

var traker=0;
var timeOut;

就我个人而言，我也避免使用类似的保留方法关键字，所以使用:

var tmr;

此外，您应该使用window.setTimeout而不仅仅是setTimeout

Answer 2

The Fix!

:

(function autoAdvance(){
    $('#fwd').trigger('click',[true]);
    timeOut = setTimeout(autoAdvance,3000);
})();

应该像这样:

function autoAdvance(){
    $('#fwd').trigger('click',[true]);
    timeOut = setTimeout(autoAdvance,3000);     
}
autoAdvance();

FF无法识别autoAdvance自调用函数