有沒有辦法切換 setInterval

Question

我只是在玩 JavaScript 中的 setInterval 函數。 我想知道是否有辦法用 HTML 按鈕切換 setInterval

這是我的代碼。

let x = 0;
const listener = document.getElementById('listener');
const numberPlace = document.getElementById('numberPlace');

const numberCounter = setInterval(() => {
  x++;
  numberPlace.innerHTML = x;
}, 100);

listener.addEventListener('click', numberCounter);

問題是該數字在頁面加載時開始計數，而不是在單擊按鈕時開始計數。

請幫忙

Answer 1

const numberCounter = () => setInterval(() => {
  x++;
  numberPlace.innerHTML = x;
}, 100);

Answer 2

setInterval可以使用取消clearInterval並且當標識符返回的整數setInterval被調用。

要切換基於setInterval的計數器，您只需切換此標識符是否存在（或不存在）。

 let counter = 0; let intervalId = null; const btn = document.getElementById('btn'); const numberPlace = document.getElementById('numberPlace'); const numberCounter = () => intervalId === null ? intervalId = setInterval(() => numberPlace.innerHTML = ++counter, 100) : (clearInterval(intervalId), intervalId = null) btn.addEventListener('click', numberCounter);

 <button id="btn">toggle</button> <div id="numberPlace"></div>