如何停止和重置setInterval计时器

Question

How do I stop and reset this setInterval timer back to 00:00?

Setting clearInterval(timer); works for stopping the time but I can't figure out how to reset the time value back to 00:00.

Here's where I'm at:

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);
};

I'm using this timer in a game so based on the users state I need to be able start , stop , and restart the time back to 0.

Answer 1

The variable totalSeconds keeps track of your time. The name of your function stopTimer() - maybe it should be restartTimer - seems a bit misleading since you're restarting the timer there but basically just set totalSeconds to 0 like:

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

Answer 2

What's happening now is that your variable keeps going up, even when you "reset" the timer.

Simply add

totalSeconds = 0;

to your stopTimer function. This will reset the variable to zero.