web-dev-qa-db-ja.com

setIntervalを終了する方法

条件が正しい場合、実行間隔を終了する必要があります。

var refreshId = setInterval(function() {
        var properID = CheckReload();
        if (properID > 0) {
            <--- exit from the loop--->
        }
    }, 10000);
50

clearInterval を使用します。

var refreshId = setInterval(function() {
  var properID = CheckReload();
  if (properID > 0) {
    clearInterval(refreshId);
  }
}, 10000);
123
CMS

ES6用に更新

変数のスコープを設定して、名前空間の汚染を回避できます。

const CheckReload = (() => {
  let counter = - 5;
  return () => {
    counter++;
    return counter;
  };
})();

{
const refreshId = setInterval(
  () => {
    const properID = CheckReload();
    console.log(properID);
    if (properID > 0) {
      clearInterval(refreshId);
    }
  },
  100
);
}
1
rovyko

setIntervalの値を clearInterval に渡します。

簡単な例

const interval = setInterval(() => {
  clearInterval(interval);
}, 1000)

カウントダウンの例

タイマーは、0になるまで1秒ごとに減少します。

let secondsToCountDown = 2

const interval = setInterval(() => {

  // just for presentation
  document.querySelector('.timer').innerHTML = secondsToCountDown

  if (secondsToCountDown === 0) {
    clearInterval(interval); // time is up
  }

  secondsToWait--;
}, 1000);
<p class="timer"></p>

分離したカウントダウンの例

let secondsToCountDown = 2

const doStuffOnInterval = () => {
  document.querySelector('.timer').innerHTML = secondsToCountDown

  if (secondsToCountDown === 0) {
    stopInterval()
  }

  secondsToCountDown--;
}

const stopInterval = () => {
  clearInterval(interval);
}

const interval = setInterval(doStuffOnInterval, 1000);
<p class="timer"></p>