使用setTimeout延迟循环迭代

Using setTimeout to delay loop iteration

本文关键字：迭代 循环 延迟 setTimeout 使用      更新时间：2023-09-26

我想在每次迭代中延迟while循环。我尝试了以下方法：

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);
}

试试这个：

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(function(){ myFunction(parameter)}, timeoutLength);
相关文章：