使用setTimeout延迟循环迭代

问题描述：

我想在每次迭代中延迟我的while循环。我试过如下：使用setTimeout延迟循环迭代

var o = 1; 
while(o<4){ 
    setTimeout("setupAnimation(o)",2000); 
    //setupAnimation(o); //<--this works but everything happens att the same time 
    o++; 
}

我也试着写这样的，没有工作之一：

var o = 1; 
function repeatMe(){ 
    setupAnimation(o); 
    o++; 
    setTimout('repeatMe()',1000); 
}

有什么建议？

答

eval速度很慢，很难调试并且存在潜在的安全问题（取决于数据的来源）。不要使用它。（将字符串传递给setTimeout通过代理使用eval）

改为将函数传递给setTimeout。您需要使用闭包来捕获您传递的函数的当前值o。

您应该也可以使用for循环而不是while循环。语法更清晰。

function setupAnimationFactory(o) { 
    return function() { 
     setupAnimation(o); 
    } 
} 

for (var o = 0; o < 4; o++){ 
    setTimeout(setupAnimationFactory(o),2000); 
}

除非我误解了这一点，否则这只会延迟整个事件2秒，而不是分隔每个电话。等同于只为整个事情设置超时一次。我认为这个问题意味着他想要将迭代排除在外。 – 2011-06-14 13:21:20

呃，它可能会。 – Quentin 2011-06-14 13:25:30

答

您可以使用此：

setTimeout(function(){ myFunction(parameter)}, timeoutLength);

这是行不通的，因为'o'在一个循环中，并且在任何超时命中0之前都会变为最后的值。 – Quentin 2011-06-14 13:18:16

是的，很好的一点。但是，我认为，你可以在匿名函数的范围内声明一个变量来传递o作为参数。 – Digbyswift 2011-06-14 13:22:00

答

试试这个：如果你想在这里使用第二种方法

var o = 1; 
function repeatMe(){ 
    setupAnimation(o); 
    o++; 
    setTimeout(function(){repeatMe();},1000); 
} 

repeatMe();

答

是工作的Javascript

<script type="text/javascript"> 

    var o = 1; 
    function repeatMe(){ 

    setupAnimation(o); 
    o++; 

    setTimout(repeatMe(),1000); 
    } 

    function setupAnimation(o){ 
     alert(o); 
    } 

    </script> 

<a href='#' onclick="repeatMe()">Click Me</a>

答

var o = 1; //Global Variable 
var animTimerId; //Global Variable 

function setupAnimation(o){ 
    // Your code goes here 

    o++; 
    if(o == 4){ 
    clearTimeout(animTimeoutId); 
    break; 
    } 
} 

function repeatMe(){ 
    animTimeoutId = setTimeout("setupAnimation(o)",2000); 
}

使用setTimeout延迟循环迭代

相关推荐