Question

我写了一个改变div

的css定位的函数

我已成功使用setTimeout以特定间隔调用该函数

现在我要做的是在同一页面上的28个不同的div上调用该函数，每个div都有自己的速度。

我的想法是我可以用for循环这样做：

for (var x = 0; x < 28; x++)
   { setInterval(function(){changeDirection(divlist[x])}, divs[divlist[x]].speed);}

使用存储速度和id的对象'divs'

我能让他们全部对抗计时器的唯一方法就是这样调用setInterval 28次......

setInterval(function(){changeDirection(divlist[1])}, divs[divlist[1]].speed);
setInterval(function(){changeDirection(divlist[2])}, divs[divlist[2]].speed);
setInterval(function(){changeDirection(divlist[3])}, divs[divlist[3]].speed);
setInterval(function(){changeDirection(divlist[4])}, divs[divlist[4]].speed);....etc

for循环不起作用......

有没有人知道为什么？有没有办法使用像这样的循环在许多不同的函数上调用setInterval

Answer 1

你需要“锚定”循环迭代器的值，否则它会不断递增，所有的间隔都会影响第29个，这是不存在的。

for(var x=0; x<28; x++) {
    (function(x) {
        // code goes here
    })(x);
}

然而，一页上有28个计时器是一个非常糟糕的主意。考虑重写代码，以便只有一个间隔根据速度值计算新位置。

Answer 2

我对这些自我调用函数的处理方法。

var i = -1;
(function cssPositioning() {
  i++;
  if ( i < 28 ) {
            changeDirection(divlist[i]);
    setInterval(cssPositioning, divs[divlist[i]].speed);
  }
})();

Answer 3

基于@Kolink的解释，您可以尝试

for (var x = 0; x < 28; x++){ 
   setInterval(function(){
     var local = x;  //anchor the variable  
     changeDirection(divlist[local])}, divs[divlist[local]].speed);
   });
}

希望这有帮助。

使用for循环调用setTimeout

3 个答案: