如何在Jquery中延迟for循环

我正在尝试制作图库，我正在使用for循环来加载所有图像。 但现在我遇到的问题是它的速度很快所以我想每次都延迟循环。

我试图设置超时，但这不起作用
有人知道如何使用Jquery延迟循环。

js代码：

function test(){ var src = 'img/nature/'; var img = ['1.jpg']; var image = [ "1.jpg", "2.jpg", "3.jpg",'4.jpg','5.jpg','6.jpg','7.jpg' ]; for ( var i = 0; i < image.length; i = i + 1 ) { $('#frame').append(''); $('.hide').show(500); setTimeout(function(){ },500); } } 

我还有一个问题。 是否可以使用Jquery加载文件夹中的所有imag？

Answer 1

你也可以试试这个：

 function test() { var src = 'img/nature/'; var img = ['1.jpg']; var image = [ '1.jpg', '2.jpg', '3.jpg','4.jpg','5.jpg','6.jpg','7.jpg' ]; setInterval(function() { $.each(image, function(index, value) { $('#frame').append(''); $('.hide').show(500); }); }, 500); } 

最后将500改为任何……

但我怀疑这不是你想要做的……下面的方法可能是你想要的：

 function test() { var src = 'img/nature/', img = ['1.jpg'], image = [ '1.jpg', '2.jpg', '3.jpg','4.jpg','5.jpg','6.jpg','7.jpg' ], maxIndex = (image.length - 1), cIndex = 0; setInterval(function() { if (cIndex == maxIndex) cIndex = 0; $('#frame').append(''); $('.hide').show(500); cIndex++; }, 500); } 

Answer 2

而不是使用for循环，您可以使用递归函数

  var src = 'img/nature/'; var img = ['1.jpg']; var image = [ "1.jpg", "2.jpg", "3.jpg",'4.jpg','5.jpg','6.jpg','7.jpg' ]; var i = 0; var showGallery = function(){ $('#frame').append(''); $('.hide').show(500); i++; if (i 0){ showGallery(); } 

Answer 3

您的幻灯片放映时间仅为500毫秒。 增加该值

setTimeout（function（）{}，500）; 在幻灯片中延迟。

并在循环内调用函数测试…以便幻灯片继续播放。

样品：

function slideit（）{

 if (!document.images) return 0 document.images.slide.src=eval("image"+step+".src") if (step<3) step++ else step=1 setTimeout("slideit()",3000) 

}

Answer 4

另一种解决方案是使用临时范围来增加超时事件的时间值。

 function test(){ var src = 'img/nature/'; var img = ['1.jpg']; var image = [ "1.jpg", "2.jpg", "3.jpg",'4.jpg','5.jpg','6.jpg','7.jpg' ]; for ( var i = 0; i < image.length; i++ ) { (function(i){ setTimeout(function(){ $('#frame').append(''); $('.hide').show(500); }, 500*i); })(i); } }