javascript - 在 for 循环中使用 setTimeout 和整数

Question

我有一个带有 id 的按钮play。

我想用这段代码在那个按钮上倒计时。但由于某种原因，我无法让它工作。

var timeoutTime = 500, seconds = 5;
var countdown = $("#play h4");
for(var i = seconds; i>0; i--)
{
    setTimeout(function() {
    countdown.text("" + i); },timeoutTime);
    timeoutTime += 1000;
}

我尝试了很多东西，我能得到的最好的结果只是一个 1 而不是 5 4 3 2 1。使用此代码，我在按钮上得到一个 0。

有什么问题 ？

Answer 1

用这个 ：

for(var i = seconds; i>0; i--) {
    (function(i){
      setTimeout(function() {
          countdown.text("" + i); }, timeoutTime);
    })(i);
    timeoutTime += 1000;
}

你的问题是 i 改变了，你总是用 i 的最后一个值调用，因为你传递给 setTimeout 的回调是在循环完成后调用的。

经典的解决方案是使用闭包来保持另一个变量（这里同名 i）具有所需的值。它之所以有效，是因为对于每次迭代，这是一个不同的函数（变量的范围是全局范围或声明它的函数）。