javascript - 每 x 秒重复一次代码，但不是 if [在此处插入检查]

Question

这是这个问题的后续，在那里我发现了如何让代码每 x 秒重复一次。是否有可能举办一个可以改变这一点的事件？即我有一个复选框，用于控制是否重复，所以我想我需要这样的东西：

$(checkbox).bind("change", function() {
    switch(whether if it is ticked or not) {
        case [ticked]:
            // Make the code repeat, while preserving the ability to stop it repeating
        case [unticked]:
            // Make the code stop repeating, while preserving the ability to start again
    }
});

我不知道我可以在cases 中放什么。

Answer 1

您可以通过将 setInterval 函数分配给变量来实现。

var interval = setInterval(function() {  }, 1000);

然后你可以停止 setInterval

clearInterval(interval);

ps 要开始您的间隔，您需要var interval = setInterval(function() { }, 1000);再次调用

Answer 2

您可以停止和开始间隔：

var timer;

function start() {
  timer = window.setInterval(function(){
    // do something
  }, 1000);
}

function stop() {
  window.clearInterval(timer);
}

start();

$(checkbox).bind("change", function() {
  if ($(this).is(':checked')) {
    start();
  } else {
    stop();
  }
});

或者你可以有一个标志导致间隔跳过代码：

var enabled = true;

var timer = window.setInterval(function(){
  if (!enabled) {
    // do something
  }
}, 1000);

$(checkbox).bind("change", function() {
  enabled = $(this).is(':checked');
});

Answer 3

function fooFunc() {
    $('#foo').text(+new Date());
}
var id;
var shouldBeStopped = false;
$('input').change(function() {
    if (shouldBeStopped) 
        clearInterval(id);
    else 
        id = setInterval(fooFunc, 200);

    shouldBeStopped = !shouldBeStopped;
});​

现场演示