setIntervalタイマーをリセットするにはどうすればよいですか?


83

setIntervalタイマーを0にリセットするにはどうすればよいですか?

var myTimer = setInterval(function() {
  console.log('idle');
}, 4000);

試しましたclearInterval(myTimer)が、完全にインターバルが止まります。0から再起動したい。

回答:


174

「再起動」とは、この時点で新しい4秒間隔を開始することを意味する場合は、タイマーを停止して再起動する必要があります。

function myFn() {console.log('idle');}

var myTimer = setInterval(myFn, 4000);

// Then, later at some future time, 
// to restart a new 4 second interval starting at this exact moment in time
clearInterval(myTimer);
myTimer = setInterval(myFn, 4000);

リセット機能を提供する小さなタイマーオブジェクトを使用することもできます。

function Timer(fn, t) {
    var timerObj = setInterval(fn, t);

    this.stop = function() {
        if (timerObj) {
            clearInterval(timerObj);
            timerObj = null;
        }
        return this;
    }

    // start timer using current settings (if it's not already running)
    this.start = function() {
        if (!timerObj) {
            this.stop();
            timerObj = setInterval(fn, t);
        }
        return this;
    }

    // start with new or original interval, stop current interval
    this.reset = function(newT = t) {
        t = newT;
        return this.stop().start();
    }
}

使用法:

var timer = new Timer(function() {
    // your function here
}, 5000);


// switch interval to 10 seconds
timer.reset(10000);

// stop the timer
timer.stop();

// start the timer
timer.start();

作業デモ:https//jsfiddle.net/jfriend00/t17vz506/


美しいオブジェクト。javascriptでOOPを使用している人を見るといつも気分がいいです!ありがとうございました!
Fortin 2016

12

を使用して間隔をクリアすると、もう一度clearIntervalできますsetInterval。また、コールバックの繰り返しを避けるために、コールバックを別の関数として外部化します。

var ticker = function() {
    console.log('idle');
};

その後:

var myTimer = window.setInterval(ticker, 4000);

その後、再起動することにしたとき:

window.clearInterval(myTimer);
myTimer = window.setInterval(ticker, 4000);

しかし、どのように?clearInterval(myTimer)、次にsetInterval(myTimer、4000)が機能しない:(
Rik de Vos

@RikdeVos、なぜそれが機能しないのですか?また、そうではありませんsetInterval(myTimer, 4000)、そうではあり、そうあるべきですsetInterval(ticker, 4000);
ダリンディミトロフ
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.