Question

我想在代码运行时更改setInterval函数时间。

我试试这个

<script type="text/javascript">
        $(function () {
            var timer;
            function come() { alert("here"); }
            timer = setInterval(come, 0);
            clearInterval(timer);
            timer = setInterval(come, 10000);
        });
    </script>

第一个SetInterval不起作用！

Answer 1

你正在清除下一行的间隔，所以第一行不会工作，因为它会立即被清除：

        timer = setInterval(come, 0);
        clearInterval(timer);
        timer = setInterval(come, 10000);

另外，正如gdoron所说，设置一个零间隔并不是真正有效，也不是一个好主意，而是使用setTimeout，或者只是在没有延迟的情况下直接运行该函数。

        come();
        clearInterval(timer);
        timer = setInterval(come, 10000);

Answer 2

你做不到。您将需要使用setTimeout，并重复调用它：

var timer; // current timeout id to clear
function come(){ /* do something */};
var time; // dynamic interval

(function repeat() {
    come();
    timer = setTimeout(repeat, time);
})();

使用此功能，您可以设置每次执行函数repeat时应用的不同“间隔”。然而，如果在超时期间更改time，则无需更改，您需要停止该超时。

Answer 3

无法直接更改函数触发的间隔。您可以做的最好是取消一个间隔并设置一个具有相同功能和更新计时器的新间隔。这是一种可行的方法：

timer = {
    timers:{},
    inc:0,
    start:function(cb,gap) {
        var key = inc;
        inc++;
        timer.timers[key] = [setInterval(cb,gap),cb];
        return key;
    },
    stop:function(id) {
        if( !timer.timers[id]) return;
        clearInterval(timer.timers[id][0]);
        delete timer.timers[id];
    },
    change:function(id,newgap) {
        if( !timer.timers[id]) return;
        clearInterval(timer.timers[id][0]);
        setInterval(timer.timers[id][1],newgap);
    }
};

用法：

var myTimer = timer.start(function() {....},1000);
// calls every second

timer.change(myTimer,5000);
// now calls every five seconds

Answer 4

timer = setInterval(come, 0); // zero isn't a valid interval...

你可能想要：

come();
timer = setInterval(come, 10000);

MDN上的文档：

delay是setInterval（）函数在每次调用func之前应该等待的毫秒数（千分之一秒）。与setTimeout一样，强制执行最小延迟。

并且：

历史上，浏览器实现setTimeout（）“clamp”：延迟小于“最小延迟”限制的连续setTimeout（）调用被强制使用至少最小延迟。最小延迟DOM_MIN_TIMEOUT_VALUE为4毫秒（存储在Firefox中的首选项：dom.min_timeout_value），DOM_CLAMP_TIMEOUT_NESTING_LEVEL为5毫秒。

Answer 5

我知道这篇文章很老，但我需要类似的东西，也许有人需要它。

这是一个没有setInterval的版本，基于其他反应的代码（Niet the Dark Absol）。

function timer()
{
    var timer = {
        running: false,
        iv: 5000,
        timeout: false,
        cb : function(){},
        start : function(cb,iv,sd){
            var elm = this;
            clearInterval(this.timeout);
            this.running = true;
            if(cb) this.cb = cb;
            if(iv) this.iv = iv;
            if(sd) elm.execute(elm);
            this.timeout = setTimeout(function(){elm.execute(elm)}, this.iv);
        },
        execute : function(e){
            if(!e.running) return false;
            e.cb();
            e.start();
        },
        stop : function(){
            this.running = false;
        },
        set_interval : function(iv){
            clearInterval(this.timeout);
            this.start(false, iv);
        }
    };
    return timer;
}

用法：

var timer_1 = new timer();
timer_1.start(function(){
    //magic here
}, 2000, false);

var timer_2 = new timer();
timer_2.start(function(){
    //more magic here
}, 3000, true);

//change the interval
timer_2.set_interval(4000);

//stop the timer
timer_1.stop();

如果函数需要在0运行，则start函数的最后一个参数是布尔值。

您也可以在此处找到该脚本：https://github.com/Atticweb/smart-interval

Answer 6

这是mi的例子，我认为这更简单易懂

const timer = {
  time: 5, // 5 time in seconds
  _time: null,
  _timeout: null,
  fun: () => {},
  start() {
    if (this._timeout == null) {
      const self = this;
      this.fun();
      this._timeout = setTimeout(function repeater() {
        self.fun();
        self._timeout = setTimeout(repeater, 1000 * self.time);
      }, 1000 * this.time);
    }
  },
  stop() {
    const timeout = this._timeout;
    this._timeout = null;
    this.set_time(); // set time to default
    clearTimeout(timeout);
  },
  set_time(time) {
    if (this._time == null) this._time = this.time;

    if (time) {
      this.time = time;
    } else {
      this.time = this._time;
    }
  },
};

说明：

时间：是每次迭代，循环或下一次调用之间的时间间隔
_time ：此变量保存默认的时间值，使用stop（）时，此变量（_time）恢复“时间”
开始：此函数开始迭代，如果再次调用，它将不会重复。
停止：此功能，停止超时并设置默认时间和_timeout
set_time ：此函数将时间设置为新值，如果不发送参数，则时间恢复为默认值，在此示例中运行时声明为“ 5”

示例：

const timer = {
      time: 5, // 5 time in seconds
      _time: null,
      _timeout: null,
      fun: () => {},
      start() {
        if (this._timeout == null) {
          const self = this;
          this.fun();
          this._timeout = setTimeout(function repeater() {
            self.fun();
            self._timeout = setTimeout(repeater, 1000 * self.time);
          }, 1000 * this.time);
        }
      },
      stop() {
        const timeout = this._timeout;
        this._timeout = null;
        this.set_time(); // set time to default
        clearTimeout(timeout);
      },
      set_time(time) {
        if (this._time == null) this._time = this.time;
    
        if (time) {
          this.time = time;
        } else {
          this.time = this._time;
        }
      },
    };
    
// print time
timer.fun = () =>{
    console.log(new Date())
};
timer.set_time(10)
timer.start()

Answer 7

我知道这是一篇旧帖子，但我已经实现了一个用于更改运行时间间隔的打字稿版本：

    class LoopTimer {
  private timer: null | NodeJS.Timer;
  private callback: (...args: any[]) => void;
  private ms: number;
  private started: boolean;

  constructor(callback: (...args: any[]) => void, ms: number) {
    this.callback = callback;
    this.ms = ms;
    this.timer = null;
    this.started = false;
  }

  start() {
    if (!this.started) {
      this.timer = setInterval(this.callback, this.ms);
      this.started = true;
    }
  }

  stop() {
    if (this.timer) {
      clearInterval(this.timer);
      this.timer = null;
      this.started = false;
    }
  }

  get getStarted(): boolean {
    return this.started;
  }

  setInterval(ms: number) {
    this.ms = ms;
    if (this.started) {
      this.stop();
      this.start();
    }
  }
}

你可以这样使用它：当间隔改变时，定时器将停止并重新启动。

    const myTimer = new LoopTimer(()=>{
    console.log("Hello");
}, 100);

myTimer.setInterval(500);

setInterval（function（），time）在运行时更改时间

7 个答案: