对阵列中的每个间隔ID再次运行设置间隔

时间:2016-02-22 16:53:45

标签: javascript setinterval clearinterval

我目前正在将一堆setInterval ID存储在一个数组中。

我最初如何设置间隔:

  intervalId = setInterval(bridgeCall, 10000);
  interValArray.push(intervalId);

我目前有一个按钮,可以通过调用此函数来停止当前正在运行的所有间隔:

  function stopCampaign() {
    if (interValArray.length > 0) {
      for (i = 0; i < interValArray.length; i++) {
        clearInterval(interValArray[i]);
        console.log("Stopped");
      }
      error = "Stopped"
        Error();
    } else {
      error = "Nothing Running"
        Error();
    }
  }

这也是相应的,所以我试图做相反的事情,重新启动它们,如下所示:

  function Campaign() {
    if (interValArray.length > 0) {
      for (i = 0; i < interValArray.length; i++) {
        setInterval(interValArray[i],10000);
        console.log("Start");
      }
      error = "Started"
        Error();
    } else {
      error = "No Agents"
        Error();
    }
  }

但不断收到错误说:

timers.js:275
    timer._repeat();
          ^

TypeError: timer._repeat is not a function
    at wrapper [as _onTimeout] (timers.js:275:11)
    at Timer.listOnTimeout (timers.js:92:15)

是否可以setInterval /再次启动它们?

2 个答案:

答案 0 :(得分:2)

除取消定时器外,您无法使用定时器手柄执行任何操作。这一行:

setInterval(interValArray[i],10000);

尝试使用句柄“重启”间隔。内置的计时器功能不支持这一点。你需要做同样的事情来启动它最初再次启动它。

你没有首先展示如何开始它们,所以我不能建议你如何进行重组以使其再次成为可能,但这是一个合成的例子:

// Initial setup
var timers = [];
for (var n = 0; n < 5; ++n) {
  startTimer(function(val) {
    document.getElementById("a" + val).innerHTML += ".";
  }.bind(null, n), Math.random() * 1000);
}
function startTimer(f, interval) {
  timers.push({
    f: f,
    interval: interval,
    handle: setInterval(f, interval)
  });
}

// Stop them after three seconds
setTimeout(function() {
  snippet.log("Pausing...");
  timers.forEach(function(timer) {
    clearInterval(timer.handle);
  });
}, 3000);

// Start them two seconds after that
setTimeout(function() {
  snippet.log("Restarting...");
  timers.forEach(function(timer) {
    timer.handle = setInterval(timer.f, timer.interval);
  });
}, 5000);

// Then stop them for good a couple of seconds later
setTimeout(function() {
  snippet.log("Stopping");
  timers.forEach(function(timer) {
    clearInterval(timer.handle);
  });
}, 7000);
<div id="a0">&nbsp;</div>
<div id="a1">&nbsp;</div>
<div id="a2">&nbsp;</div>
<div id="a3">&nbsp;</div>
<div id="a4">&nbsp;</div>
<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="//tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

答案 1 :(得分:1)

函数setInterval(function, interval)返回间隔的ID,当您将它们存储在数组中时,您已经理解了该ID。

但是,您无法重新启动&#39;仅使用其ID的间隔。您必须先清除间隔,然后使用在数组中存储项目时使用的初始参数调用setInterval()

您可以修改数组中的项目以保留重新启动超时所需的所有信息:

var interValArray = [];

nextTimeout = {
  fn: functionNameToCall,
  interval: 10000,
  id: 0
}

nextTimeout.id = window.setInterval(
  nextTimeout.fn, 
  nextTimeout.interval
)

interValArray.push( nextTimeout )

您的新stopCampaign()看起来像这样:

function stopCampaign() {
  if (interValArray.length > 0) {
    for (i = 0; i < interValArray.length; i++) {
      clearInterval(interValArray[i].id);
      console.log("Stopped");
    }
    error = "Stopped"
      Error();
  } else {
    error = "Nothing Running"
      Error();
  }
}

您的新Campaign()看起来像这样:

function Campaign() {
  if (interValArray.length > 0) {
    for (i = 0; i < interValArray.length; i++) {
      interValArray[i].id =
        setInterval(interValArray[i].fn,interValArray[i].interval);
      console.log("Start");
    }
    error = "Started"
      Error();
  } else {
    error = "No Agents"
      Error();
  }
}