Javascript 在循环中使用setInterval时出现闪烁和毛刺

开始按钮：

  function startTimer(duration, activity) {
    function countdown() {
      if ((duration - 1) > 0) {
        duration--;
        $("#timer").html(convertNumbers(duration))
      } else {
        if (activity === "session") {
          startBreak();
        } else {
          startSession();
        }
      }    
    }

    setInterval(countdown, 1000) 
}

function startSession() {
    var time = parseInt(($("#session_time").text()), 10);
    startTimer(time * 60, "session");
    $("#activity").html("Session");
}

function startBreak() {
    var time = parseInt(($("#break_time").text()), 10);
    startTimer(time * 60, "break");
    $("#activity").html("Break");
}

我正在使用setInterval制作一个波莫多罗钟，它每秒钟运行一次，递减一秒。当按下开始按钮时，startSession（）函数获取时间并调用startTimer（）函数，当持续时间为0时，该函数指向setBreak（）

---

理想情况下，它会在startSession和startBreak之间切换，但我在初始倒计时后在“#timer”中设置的文本（时间左边）中会出现闪烁和随机数。这可能与startTimer（）调用startBreak（）时没有结束间隔有关。

您永远不会清除初始间隔，因此当中断发生时，两个间隔同时运行

setInterval

返回间隔的ID，您可以将该ID传递到

clearInterval（）

以再次停止它

$("#start").click(function() {
  startSession();
});

---

有关更多信息，请参阅文档。

这可能与不结束间隔有关

-您是对的，您需要使用

clearInterval

。。。您还需要保存间隔ID，以便清除它

var timer = setInterval(function () {
    console.log('A second has passed!');
}, 1000});

setTimeout(function () {
    clearInterval(timer);
    console.log('Seconds no longer passes');
}, 10 * 1000);