关于javascript：jQuery和setTimeout里面的For循环


jQuery and setTimeout inside For loop

本问题已经有最佳答案，请猛点这里访问。

我刚刚遇到一个非常奇怪的问题(虽然我修好了)但我想知道它为什么会在第一时间发生：

1
2
3
4
5
6
7
8
9
10
11
function stuffAppear() {
    var i;
    for (i = 0; i < speech.length; i++) {
        apperance(i);
    }
}
function apperance(i) {
    var x = speech[i];
    setTimeout(function() {$(speech[i]).fadeIn(1000); console.log(i);}, 1000 + i * 1500);
    console.log(speech[i]);
}

控制台日志显示"＃yo0"，然后显示"＃ma0b"(这是必需的)，但同时，它们从未消失

我玩了代码，直到我达到这个：

1
2
3
4
5
6
7
8
9
10
function stuffAppear() {
    var i;
    for (i = 0; i < speech.length; i++) {
        apperance(i);
    }
}
function apperance(i) {
    var x = speech[i];
    setTimeout(function() {$(x).fadeIn(1000); console.log(i);}, 1000 + i * 1500);
}

这就行了，但我不知道为什么第一个代码不起作用。 有人可以向我解释一下吗？
谢谢你！

相关讨论

在JSFiddle中，两个版本都可以正常工作(并且相同)：

第一：http：//jsfiddle.net/TrueBlueAussie/Bkz55/3/

1
2
3
4
5
6
7
8
9
10
11
12
13
var speech = ["#yo0","#ma0b","#blah"];

function stuffAppear() {
    var i;
    for (i = 0; i < speech.length; i++) {
        apperance(i);
    }
}
function apperance(i) {
    var x = speech[i];
    setTimeout(function() {$(speech[i]).fadeIn(1000); console.log(i);}, 1000 + i * 1500);
    console.log(speech[i]);  // <<< THIS WOULD OCCUR IMMEDIATELY
}

第二：http：//jsfiddle.net/TrueBlueAussie/Bkz55/4/

1
2
3
4
5
6
7
8
9
10
11
12
var speech = ["#yo0","#ma0b","#blah"];

function stuffAppear() {
    var i;
    for (i = 0; i < speech.length; i++) {
        apperance(i);
    }
}
function apperance(i) {
    var x = speech[i];
    setTimeout(function() {$(x).fadeIn(1000); console.log(i);}, 1000 + i * 1500);
}

所以我怀疑你看到的是你的其他代码的副作用(未显示)。

唯一奇怪的是你在第一个版本登录两次(一次在setTimeout之外，它会在开始时显示 - 正如你所提到的那样)

跟进：

现在已经看到了真正的代码，原因是在超时期间更改了speech数组。 当最终命中超时函数时，speech数组为空！

相关讨论