Wie setze ich den setInterval-Timer zurück?


83

Wie setze ich einen setIntervalTimer auf 0 zurück?

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

Ich habe es versucht, clearInterval(myTimer)aber das stoppt das Intervall vollständig. Ich möchte, dass es von 0 neu gestartet wird.

Antworten:


173

Wenn Sie mit "Neustart" in diesem Moment ein neues 4-Sekunden-Intervall starten möchten, müssen Sie den Timer anhalten und neu starten.

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

Sie können auch ein kleines Timer-Objekt verwenden, das eine Rücksetzfunktion bietet:

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

Verwendung:

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

Arbeitsdemo: https://jsfiddle.net/jfriend00/t17vz506/


Schönes Objekt. Ich fühle mich immer gut, wenn ich jemanden sehe, der OOP in Javascript verwendet! Vielen Dank!
— Fortin

12

Sobald Sie das Intervall mit löschen, können clearIntervalSie setIntervalnoch einmal. Und um zu vermeiden, dass der Rückruf wiederholt wird, externalisieren Sie ihn als separate Funktion:

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

dann:

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

Wenn Sie sich dann für einen Neustart entscheiden:

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

aber wie? clearInterval (myTimer) und dann setInterval (myTimer, 4000) funktionieren nicht :(
— Rik de Vos

@RikdeVos, warum funktioniert es nicht? Auch ist es nicht setInterval(myTimer, 4000), sollte es sein setInterval(ticker, 4000);.
— Darin Dimitrov
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.