鍍金池/ 問答/HTML/ 如何停止for循環(huán)中的setTimeout?

如何停止for循環(huán)中的setTimeout?

有一個需求
每間隔10秒向一個div中輸出一段文字,當循環(huán)50次以后從0開始重新循環(huán)直到點擊關(guān)閉按鈕停止循環(huán),怎么實現(xiàn)呢?

下面是我之前寫的代碼,但是cleartimeout沒有生效,因為for循環(huán)又將settimeout激活了,又什么好的方法嗎?

for (let i = 0, len = this.params.playTimes + 1; i < len; i++) {
    this.playText = setTimeout(() => {
        this.fillText(i);
        var myDate = new Date();
        console.log(i,myDate.toLocaleString());
    }, i * this.params.speed * 1000);
}
// setTimeout在for中被重新激活 todo
clearTimeout(this.playText);
回答
編輯回答
呆萌傻

你每次調(diào)用setTimeout都會創(chuàng)建一個定時器啊……如果你只清除最后一個定時器的話沒有用

一種解決辦法是維護一個定時器列表，按鈕關(guān)閉的時候?qū)φ麄€列表調(diào)用clearTimeout
第二種方法是維護一個“需要定時刷新”Flag，計時器內(nèi)的函數(shù)通過setTimeout遞歸調(diào)用自身，并在遞歸前檢查這個Flag，如果Flag被按鈕置為false就退出遞歸

2017年12月2日 02:11
編輯回答
別傷我

如果是要每隔十秒觸發(fā)一次，50次后終止，為何不用setInterval呢？

let count = 50
let intervalKey = setInterval(() => {
  // do things
  console.log('do')
  if (--count === 0) clearInterval(intervalKey)
}, 10 * 1e3)
2017年8月9日 11:07
編輯回答
糖豆豆

我覺得用setInterval，clearInterval, 配合一個計數(shù)器變量不是更好用嗎? 到了50次后，將計數(shù)器重置為1. 停止按鈕點擊后，調(diào)用clearInterval停止。

var count = 1;
var fixTextInterval = setInterval(function() {
        dosomething();
        count++;
        if(count > 50) count = 1;
   }, speed*1000);

btnStop.click(function() {
    clearInterval(fixTextInterval);
});
2017年12月8日 12:57