Javascript 如何在每个函数中重置索引以不断地调用它

我已经在jQuery中实现了我自己的幻灯片放映，在第一次迭代中，我遇到的问题是当函数完成对所有图像的迭代时，如何从第一次重新启动它，并不断地运行这个过程

function startSlideShow(interval) {
var slides = $('#contain').children('div');
console.log(slides.length);
slides.each(function (i, v) {
    setTimeout(function () {
        var slide = $(v);
        console.log(i + "-" + v);
        $('#currentImage').attr('src', slide.find('img').attr('src')).fadeIn(interval * 100);
        $('#slideDesc').html(slide.find('span').html()).fadeIn(interval * 100);
    }, i * interval * 1000);
});

//startSlideShow(interval);
}

---

我尝试递归调用它，但没有成功，并挂起了整个页面。

您正在为将来设置超时，每个图像一个超时。使此功能继续工作的唯一方法是在

slides.length*interval*1000

中设置另一个超时以重新设置超时。很多暂停

这不是一种特别好的做事方式。超时时间并不精确，也不会完全准确，特别是如果你让它运行很长时间

更好的方法是设置一个超时，并在函数结束时设置另一个超时。这将（大约）每

n

毫秒运行一次函数。您可以每轮递增一个计数器，然后在达到

slides.length

时重置它

例如

---

您正在为未来设置超时，每个图像一个。使此功能继续工作的唯一方法是在

slides.length*interval*1000

中设置另一个超时以重新设置超时。很多暂停

这不是一种特别好的做事方式。超时时间并不精确，也不会完全准确，特别是如果你让它运行很长时间

更好的方法是设置一个超时，并在函数结束时设置另一个超时。这将（大约）每

n

毫秒运行一次函数。您可以每轮递增一个计数器，然后在达到

slides.length

时重置它

例如

试一试

演示：

试试看

---

演示：

效果完美。但是你能为我解释一下我对这一行的理解吗

idx=idx%slides.length？
%
=模数（除法的余数）。因此，
idx%slides.length
返回idx/slides.length的余数。这样，idx总是介于0和slides.length.works之间的数字。但是你能为我解释一下我对这一行的理解吗
idx=idx%slides.length？
%
=模数（除法的余数）。因此，
idx%slides.length
返回idx/slides.length的余数。这样，idx总是一个介于0和slides.length之间的数字。
var counter = 0;

var handler = function() {
    counter += 1;

    if (counter == slides.length) { counter = 0; }

    // Show slide 'counter'

    setTimeout(handler, interval * 1000);
}

handler();

function startSlideShow(interval) {
    var slides = $('#contain').children('div');
    var idx = 0;
    setInterval(function(){
        var slide = slides.eq(idx++);
            $('#currentImage').attr('src', slide.find('img').attr('src')).fadeIn(interval * 100);
            $('#slideDesc').html(slide.find('span').html()).fadeIn(interval * 100);
            idx = idx % slides.length;
    }, 1000 * interval)
}