循环内的javascript setInterval函数不起作用

Question

我试图“一次”启动几个 setInterval 函数。 我有一个 for 循环，它调用一个索引函数，其中包含 setInterval。

我在这里寻找答案： 循环内的 JavaScript 闭包 – 简单的实际示例和这里： setInterval with loop time

但我仍在挣扎，没有成功......

我已经检查了 tab 和 tab2，如果我在 setInterval 函数之外使用 console.log 读取它们，它们都可以工作

这是我的代码：

var tab = <?php echo json_encode($matrice); ?>;
var tab2 = new Array();

var funcs = [];

var countDownAction = new Array();

function countDown(i)
{
    countDownAction[i] = setInterval(function(i)
    {
        // some actions

    }, 1000);  
}


for(var i = 0; i < tab.length; i++)
{
    tab2[i] = [];

    tab2[i]['hours'] = tab[i]['hours'];
    tab2[i]['minutes'] = tab[i]['minutes'];
    tab2[i]['seconds'] = tab[i]['seconds'];

    funcs[i] = countDown.bind(this, i);
}

for(var j = 0; j < tab.length; j++)
{
    funcs[j]();
}

Answer 1

setInterval的函数在没有任何参数的情况下被调用。 因此，函数体内的i将是未定义的。

考虑重写countDown函数如下：

function countDown(i)
{
    countDownAction[i] = setInterval(function()
    {
        // some actions

    }, 1000);  
}

这样，函数体就可以访问外部作用域中的i 。

要清除计时器，例如 3.5 秒后，您可以执行以下操作：

setTimeout(function () {
    for (var k = 0; k < tab.length; k++) {
        clearInterval(countDownAction[k]);
    }
}, 3500);

Answer 2

我建议您将全局变量用于 countDownAction ，您可以尝试以下方法吗？

window.countDownAction = window.countDownAction || [];

Answer 3

问题是循环太快了，所以 setInterval 函数获取 i 变量的最后一个值。 我们需要使用这样的外部函数直接在区间中设置 i 值：

var interval_Array = new Array();

for(var i; i<= number ;i++){
    var newinterval = (i+1) * 1000; //Place any process according to your time
    external_function(i,newinterval);
};

function external_function(this_i,this_interval){
    interval_Array[i]=setInterval(function(){
      //your script that contains i variable
    },this_interval);
};