为什么setInterval()循环每次都变得更快？

Question

我正在Javascript上构建一个自定义滑块,我希望每次用户点击滑块的div时,滑块应停止X秒.

我的代码是:

$(document).ready(function () {
    var ciclo;
    var index_slide = 1;

    function startSlidercicle() {
        ciclo = setInterval( function() {
            // Slider code goes here
        }, 3000); 
    }

    //Here I start the slider animation
    startSlidercicle();

    //When the user clicks on a div called 'slide', stop the cycle and start again the animation cycle
    $('.slide').on('click', function() {
        clearInterval(ciclo);
        setTimeout(startSlidercicle(), 3000);
    });
});

但问题是每次我点击并停止滑块时,循环开始越来越快.我该如何解决？

Answer 1

代替：

clearInterval(ciclo);
setTimeout(startSlidercicle(), 3000);

要么：

clearInterval(ciclo);
setTimeout(startSlidercicle, 3000);

我将代码更改为：

clearInterval(ciclo);
startSlidercicle();

现在，滑块工作正常。我认为，在前两个建议中，每当我单击div时，都会创建一个新函数，该函数在现有循环中“重叠”，因此看起来滑块加快了，但它只是一个循环而已另一个。