在 jQuery 中推进幻灯片放映

Question

我使用教程杂志中的这段代码：

$(window).load(function(){

    // The window.load event guarantees that all the images are loaded before the auto-advance begins.
    var timeOut = null;

    $('#slider_navigator .arrow, #slider_navigator .dot').click(function(e,simulated){
        // The simulated parameter is set by the trigger method.
        if(!simulated){
            // A real click occured. Cancel the auto advance animation.
            clearTimeout(timeOut);
        }
    });

    // A self executing named function expression:
    (function autoAdvance(){
        // Simulating a click on the next arrow.
        timeOut = setTimeout(autoAdvance,2000);
        $('.slider_rightlink').trigger('click',[true]);
    })();

});

这与预期的一样，除了一件事之外，当我加载页面时，第一张幻灯片立即前进。加载后，它可以与幻灯片的其余部分很好地旋转。

我该如何更改它，使其像其他幻灯片一样显示第一张幻灯片 2 秒？

Answer 1

$(window).load(function(){setTimeout(function(){

    // The window.load event guarantees that all the images are loaded before the auto-advance begins.
    var timeOut = null;

    $('#slider_navigator .arrow, #slider_navigator .dot').click(function(e,simulated){
        // The simulated parameter is set by the trigger method.
        if(!simulated){
            // A real click occured. Cancel the auto advance animation.
            clearTimeout(timeOut);
        }
    });

    // A self executing named function expression:
    (function autoAdvance(){
        // Simulating a click on the next arrow.
        timeOut = setTimeout(autoAdvance,2000);
        $('.slider_rightlink').trigger('click',[true]);
    })();

},2000);}

);

可能有一个 setTimeout jQuery 函数，但这会起作用。

Answer 2

不要让它自动执行函数：

function autoAdvance(){
    // Simulating a click on the next arrow.
    timeOut = setTimeout(autoAdvance,2000);
    $('.slider_rightlink').trigger('click',[true]);
};
timeOut = setTimeout(autoAdvance,2000);