Javascript 在数组中循环并延迟函数

我试图连续循环遍历一个数值数组，该数组将作为触发另一个函数的延迟值传递给setInterval函数。以下是我所拥有的：

HTML:

打开

JavaScript:

$(document).ready(function(){
    var timing = [5000, 10000, 17000, 8000, 14000, 9000, 12000, 8000, 20000, 7000, 13000, 7000, 17000, 8000, 13000, 12000, 18000]
    //function to change
    function change(){
            var p = $("p").html();
            if(p === "On"){
                $("p").html("Off"); 
            } else {
                $("p").html("On");
            }
        }


    function myFunction(){
        for (var i = 0; i < timing.length; i++){
            var switchTime = timing[i];

            setInterval(function(){
                change(); 

            },switchTime);

        }
    } myFunction();

});

$（文档）.ready（函数（）{
var定时=[5000,10000,17000,8000,14000,9000,12000,8000,20000,7000,13000,7000,17000,8000,13000,12000,18000]
//功能改变
函数更改（）{
var p=$（“p”）.html（）；
如果（p==“开”）{
$（“p”）.html（“关闭”）；
}否则{
$（“p”）.html（“On”）；
}
}
函数myFunction（）{
对于（变量i=0；i

---

我希望更改功能在不同的延迟时间连续启动。现在，当我运行它时，时间似乎不正确。如有任何建议，我们将不胜感激。谢谢

只需在

setInterval

函数中增加变量

i

function myFunction(){
    for (var i = 0; i < timing.length; ){
        var switchTime = timing[i];

        setInterval(function(){
            change(); 
           i++;
        },switchTime);

    }
}

函数myFunction（）{
对于（变量i=0；i

只需在

setInterval

函数中增加变量

i

function myFunction(){
    for (var i = 0; i < timing.length; ){
        var switchTime = timing[i];

        setInterval(function(){
            change(); 
           i++;
        },switchTime);

    }
}

函数myFunction（）{
对于（变量i=0；i

使用

setTimeout

而不是

setInterval

，因为这是一个循环

setInterval

将初始化一个计时器，该计时器将在指定的延迟时间内连续触发（例如，如果延迟5秒，它将在5、10、15等时间触发）。通过在迭代中使用

setTimeout

，计时器在指定的延迟后每次迭代只触发一次，下一次迭代将为下一个延迟值初始化一个新计时器。

使用

setTimeout

而不是

setInterval

，因为这是在循环中进行的

setInterval

将初始化一个计时器，该计时器将在指定的延迟时间内连续触发（例如，如果延迟5秒，它将在5、10、15等时间触发）。通过在您的迭代中使用

setTimeout

，计时器在指定的延迟后每次迭代只触发一次，下一次迭代为下一个延迟值初始化一个新计时器。

我假设您可能没有在调用

setInterval

时清除旧的间隔。根据需要，您可能需要使用

clearInterval

清除以前的间隔。特别是如果你在所有的间歇期都使用相同的方法，我想你可能得不到你想要的。因此：

创建一个间隔，全局保存当前ID

调用回调时，使用

clearInterval

函数清除当前间隔

重复

---

我假设您可能没有在调用

setInterval

时清除旧的间隔。根据需要，您可能需要使用

clearInterval

清除以前的间隔。特别是如果你在所有的间歇期都使用相同的方法，我想你可能得不到你想要的。因此：

创建一个间隔，全局保存当前ID

调用回调时，使用

clearInterval

函数清除当前间隔

重复

---

在任何情况下，使用循环都不会起作用，因为许多

setInterval

（或

setTimeout（）

）会在几微秒内“立即”启动。
因此，他们按照自己的

计时[i]

完成自己的工作，但几乎是在同一时间

相反，您必须仅在前一步结束时启动每一步

下面是一个工作示例（另请参见），其中我添加了一些过程的视觉跟踪：

HTML:

打开

Javascript:

$(document).ready(function(){
  var timing = [
    5000, 10000, 17000, 8000, 14000, 9000, 12000, 8000, 20000, 7000, 13000,
    7000, 17000, 8000, 13000, 12000, 18000
  ];
  function myFunction(i){
    i |= 0;
    if (i < timing.length - 1) {
      var switchTime = timing[i]
          $onOff = $('#onOff');
      $('#delay').html('i=' + i + ', delay=' + switchTime);
      $onOff.html($onOff.html() == 'On' ? 'Off' : 'On');
      setTimeout(
        function() {
          myFunction(i + 1);
        }, switchTime
      )
    } else {
      $('#delay').html('end');
    }
  }
  myFunction();
});

$（文档）.ready（函数（）{
var定时=[
5000, 10000, 17000, 8000, 14000, 9000, 12000, 8000, 20000, 7000, 13000,
7000, 17000, 8000, 13000, 12000, 18000
];
函数myFunction（i）{
i |=0；
如果（i

在任何情况下，使用循环都不会起作用，因为许多

设置间隔

（或

设置超时（）

）会在几微秒内“立即”启动。
因此，他们按照自己的

计时[i]

完成自己的工作，但几乎是在同一时间

相反，您必须仅在前一步结束时启动每一步

下面是一个工作示例（另请参见），其中我添加了一些过程的视觉跟踪：

HTML:

打开

Javascript:

$(document).ready(function(){
  var timing = [
    5000, 10000, 17000, 8000, 14000, 9000, 12000, 8000, 20000, 7000, 13000,
    7000, 17000, 8000, 13000, 12000, 18000
  ];
  function myFunction(i){
    i |= 0;
    if (i < timing.length - 1) {
      var switchTime = timing[i]
          $onOff = $('#onOff');
      $('#delay').html('i=' + i + ', delay=' + switchTime);
      $onOff.html($onOff.html() == 'On' ? 'Off' : 'On');
      setTimeout(
        function() {
          myFunction(i + 1);
        }, switchTime
      )
    } else {
      $('#delay').html('end');
    }
  }
  myFunction();
});

$（文档）.ready（函数（）{
var定时=[
5000, 10000, 17000, 8000, 14000, 9000, 12000, 8000, 20000, 7000, 13000,
7000, 17000, 8000, 13000, 12000, 18000
];
函数myFunction（i）{
i |=0；
如果（i

到底是什么不起作用？