如何停止和重置 setInterval 计时器

Question

如何停止此 setInterval 计时器并将其重置回 00:00？

设置 clearInterval(timer); 可以停止时间，但我不知道如何将时间值重置回 00:00。

这是我所在的位置：

HTML

<span class="timer">
  <label id="minutes">00</label>:<label id="seconds">00</label>
</span>

JS

const minutesLabel = document.getElementById("minutes");
const secondsLabel = document.getElementById("seconds");
let timer = setInterval(setTime, 1000);

function setTime() {
  ++totalSeconds;
  secondsLabel.innerHTML = pad(totalSeconds % 60);
  minutesLabel.innerHTML = pad(parseInt(totalSeconds / 60));
}

function pad(val) {
  let valString = val + "";
  if (valString.length < 2) {
    return "0" + valString;
  } else {
    return valString;
  }
}

stopTimer = () => {
  clearInterval(timer);
  timer = setInterval(setTime, 1000);
};

我在游戏中使用此计时器，因此根据用户状态，我需要能够 start、stop 和 restart 将时间归零。

Answer 1

变量 totalSeconds 记录您的时间。函数的名称 stopTimer() - 也许应该是 restartTimer - 似乎有点误导，因为你在那里重新启动计时器但基本上只是将 totalSeconds 设置为 0，如：

stopTimer = () => {
  totalSeconds = 0;
  clearInterval(timer);
  timer = setInterval(setTime, 1000);
};

Answer 2

现在发生的事情是你的变量一直在上升，即使你 "reset" 计时器。

只需添加

totalSeconds = 0;

到您的 stopTimer 函数。这会将变量重置为零。

如何停止和重置 setInterval 计时器

How do I stop and reset a setInterval timer

javascript

timer

setinterval

clearinterval