如何重置 setInterval 计时器？

Posted 2023-02-22

【中文标题】如何重置 setInterval 计时器？

【英文标题】：How do I reset the setInterval timer?

【发布时间】：2011-12-28 21:56:24

【问题描述】：

如何将setInterval 计时器重置为 0？

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

我试过clearInterval(myTimer) 但这完全停止了间隔。我希望它从 0 开始。

【参考方案1】：

如果“重启”是指此时开始一个新的 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/

【参考方案2】：

使用clearInterval 清除间隔后，您可以再次使用setInterval。并且为了避免重复回调，将其外部化为一个单独的函数：

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

然后：

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

那么当你决定重启时：

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