轮播图 为什么函数每次都被被连续调用两次

Question

为什么函数每次都被被连续调用两次

 

Answer 1

在上面的代码中，函数 toggle() 被连续调用两次的原因是因为 setInterval() 函数的回调函数中再次调用了 toggle() 函数。
setInterval(function(){toggle(curIndex % lis.length)},2000);

这行代码表示每隔 2000 毫秒，就会调用 toggle(curIndex % lis.length) 函数。而这个函数的 curIndex 变量在上面的 toggle() 函数中被定义和改变了。

解决方法：

你可以在setInterval()函数中设置一个变量来记录当前图片的索引，而不是在 toggle() 函数中使用全局变量来记录当前图片索引。可以在 setInterval() 函数中更改 curIndex 的值，而不是将其传递给 toggle() 函数作为参数。这样，每次调用 toggle() 函数时都会使用最新的 curIndex 值。

也可以在setInterval()中使用clearInterval()来停止轮播图函数的调用。
或者在每次调用完之后，在setInterval()中改变调用函数