如何使setInterval方法只运行一个实例

Question

我有一个按钮，当单击时，启动计时器并将整数减少1每秒。但是，如果多次单击该按钮，则由于多次调用setInterval，整数会每秒减少1次以上。

如何使它，即使多次单击按钮，计时器每秒仅下降1（我不想禁用该按钮）。

var time = document.getElementById("time");
document.getElementById("Btn").addEventListener("click", () => {
  var decreaseTime = setInterval(() => {
            if (time.textContent != 0) {
                time.innerHTML = time.textContent - 1;
            }
        }, 1000);

   if (time.textContent == 0) {
            clearInterval(decreaseTime);
        }
});

Answer 1

您应该在更高的范围内定义reduceTime变量，然后在定义间隔之前检查它是否存在。例如：

var time = document.getElementById("time");
decreaseTime = undefined;
document.getElementById("Btn").addEventListener("click", () => {
  if(!decreaseTime){
    decreaseTime = setInterval(() => {
      if (time.textContent != 0) {
        time.innerHTML = time.textContent - 1;
      }
    }, 1000);

    if (time.textContent == 0) {
      clearInterval(decreaseTime);
    }
  }
});