设置ajax延迟执行,for循环遍历如何延时执行

如要遍历一个数组，for语句要如何延时输出数组中的项目，一般情况下想当然都会这样写

var arr = [1, 2, 3, 4, 5];

for (var i = 0; i < arr.length; i++) {

setTimeout(function () {

document.getElementById('dv').innerHTML += arr[i] + '
';

}, 3000);

}

上面的代码将会在3秒后同时显示5行undefined出来，为什么会出现这种情况。

1)同时显示，是因为setTimeout并不会挂起其他代码运行，for循环中几乎瞬时完成遍历，同时启动了5个计时器，然后3s后基本是同时执行了回调函数。

2)出现undefined设计到闭包，for循环后i已经变为arr.length，5，执行setTimeout回调时i为5，所以arr[5]为undefined，闭包相关看这个：JavaScript 闭包

要想延时输出数组项，应该递归调用setTimeout，而不是for语句体中同时启动计时器。

延时遍历数组代码如下

var arr = [1, 2, 3, 4, 5];

function delayEachArray(delay, arr, index) {

if (index == undefined) index = 0;

document.getElementById('dv').innerHTML+=arr[index]+'
';

index++;

if (index < arr.length) setTimeout(function () { delayEachArray(delay, arr, index); }, delay);

else document.getElementById('dv').innerHTML += '数组遍历结束
';

}

delayEachArray(3000, arr);

加支付宝好友偷能量挖...

原创文章，转载请注明出处：for循环遍历如何延时执行

2016-6-24Web开发网