如何停止 setTimeout 循环?

例如:function setBgPosition() {无功c = 0，定时器 = 0;无功数字 = [0, -120, -240, -360, -480, -600, -720];函数运行(){Ext.get('common-spinner').setStyle('background-position', numbers[c++] + 'px 0px');如果 (c >= numbers.length) {c = 0;}timer = setTimeout(run, 200);}timer = setTimeout(run, 200);返回停止；功能停止(){如果(定时器){清除超时(定时器)；定时器 = 0;}}所以你可以把它用作:var stop = setBgPosition();//...稍后，当您准备停止时...停止();请注意，不是让 setBgPosition 再次调用自身，而是将 c 设置回 0.否则，这是行不通的.另请注意，我使用 0 作为超时未挂起时的句柄值；0 不是 setTimeout 的有效返回值，因此它是一个方便的标志.这也是我认为使用 setInterval 而不是 setTimeout 会更好的(少数)地方之一.setInterval 重复.所以:function setBgPosition() {无功c = 0;无功数字 = [0, -120, -240, -360, -480, -600, -720];函数运行(){Ext.get('common-spinner').setStyle('background-position', numbers[c++] + 'px 0px');如果 (c >= numbers.length) {c = 0;}}返回 setInterval(run, 200);}这样使用:var timer = setBgPosition();//...稍后，当您准备停止时...清除间隔(定时器)；尽管如此，我还是想找到一种方法，通过检测某些完成条件已得到满足，使 setBgPosition 停止本身.>I'm trying to build a loading indicator with a image sprite and I came up with this functionfunction setBgPosition() { var c = 0; var numbers = [0, -120, -240, -360, -480, -600, -720]; function run() { Ext.get('common-spinner').setStyle('background-position', numbers[c++] + 'px 0px'); if (c<numbers.length) { setTimeout(run, 200); }else { setBgPosition(); } } setTimeout(run, 200);}so the out put is looks like thishttp://jsfiddle.net/TTkre/I had to use setBgPosition(); inside else to keep this running in a loop so now my problem is how to stop this loop once I want [load finished]? 解决方案 setTimeout returns a timer handle, which you can use to stop the timeout with clearTimeout.So for instance:function setBgPosition() { var c = 0, timer = 0; var numbers = [0, -120, -240, -360, -480, -600, -720]; function run() { Ext.get('common-spinner').setStyle('background-position', numbers[c++] + 'px 0px'); if (c >= numbers.length) { c = 0; } timer = setTimeout(run, 200); } timer = setTimeout(run, 200); return stop; function stop() { if (timer) { clearTimeout(timer); timer = 0; }}So you'd use that as:var stop = setBgPosition();// ...later, when you're ready to stop...stop();Note that rather than having setBgPosition call itself again, I've just had it set c back to 0. Otherwise, this wouldn't work. Also note that I've used 0 as a handle value for when the timeout isn't pending; 0 isn't a valid return value from setTimeout so it makes a handy flag.This is also one of the (few) places I think you'd be better off with setInterval rather than setTimeout. setInterval repeats. So:function setBgPosition() { var c = 0; var numbers = [0, -120, -240, -360, -480, -600, -720]; function run() { Ext.get('common-spinner').setStyle('background-position', numbers[c++] + 'px 0px'); if (c >= numbers.length) { c = 0; } } return setInterval(run, 200);}Used like this:var timer = setBgPosition();// ...later, when you're ready to stop...clearInterval(timer);All of the above notwithstanding, I'd want to find a way to make setBgPosition stop things itself, by detecting that some completion condition has been satisfied. 这篇关于如何停止 setTimeout 循环?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！ 上岸，阿里云！