Question

我是JS / jQuery的新手，并且对于停止使用setInterval函数在x ms（或运行X次之后）运行时的使用感到非常困惑，这显然发生在clearInterval中。我知道这个问题之前也有类似问题，但无法帮助我。

如你所见，它以1000ms的延迟开始，然后重复9000ms（或者如果更好的话，运行3次后），然后它需要停止。这样做最理想的方式是什么？我无法正确使用clearInterval函数。谢谢你的答案！

var elem = $('.someclass');

setTimeout(function() {
    setInterval(function() {
        elem.fadeOut(1500);
        elem.fadeIn(1500);
    },3000);
},1000);

Answer 1

要停止间隔，您需要保留setInterval返回的句柄：

setTimeout(function() {
    var cnt = 0;
    var handle = setInterval(function() {
        elem.fadeOut(1500);
        elem.fadeIn(1500);
        if (++cnt == 3) clearInterval(handle);
    },3000);
},1000);

Answer 2

创建一个计数器，并保持对您的间隔的引用。当计数器击中3时，清除间隔：

var elem = $('.someclass');

setTimeout(function() {
    var counter = 0;
    var i = setInterval(function() {
        elem.fadeOut(1500);
        elem.fadeIn(1500);
        counter++;
        if (counter == 3)
            clearInterval(i);
    },3000);
},1000);

Answer 3

鉴于你要做的事情是非常静态的，为什么不简单地添加延迟并忘记所有的计时器。：

var elem = $('.someclass');
elemt.delay(1000).fadeOut(1500).fadeIn(1500).delay(3000).fadeOut(1500).fadeIn(1500).delay(3000).fadeOut(1500).fadeIn(1500).delay(3000);

如果要减小代码大小，请在小循环中运行上述内容：

elemt.delay(1000);
for (var i = 0; i < 3; i++){
   elemt.fadeOut(1500).fadeIn(1500).delay(3000);
}

Answer 4

您需要在三次之后清除间隔：

setTimeout(function() {
    var times = 0;
    var interval = setInterval(function() {
        elem.fadeOut(1500);
        elem.fadeIn(1500);
        if (++times > 3) clearInterval(interval);
    },3000);
},1000);

clearInterval停止setInterval纯粹基于时间工作

4 个答案: