Question

我需要能够在运行时停止setInterval函数。这个想法是，如果浏览器调整大小，那么它将是计时器（320px或更少）这是间隔：

var blurb_scroll = setInterval(function(){ 
        $(".content .blurb-container:first").next().css({'opacity':0}).delay(400).animate({'opacity':1}, 'fast');
        $(".content .blurb-container:first").animate({'margin-top':'-190px', 'opacity':'0'}, 'slow', function(){
            $(this).appendTo(blurb_container).removeAttr('style');
        });
    },6000);

Answer 1

您必须使用clearInterval。将变量与setInterval一起设置为全局变量，然后可以在任何地方停止它。

<html>
<body>

<input type="text" id="clock">
<script language=javascript>
var int=self.setInterval(function(){clock()},1000);
function clock() {
  var d=new Date();
  var t=d.toLocaleTimeString();
  document.getElementById("clock").value=t;
  }
</script>
</form>
<button onclick="int=window.clearInterval(int)">Stop</button>

</body>
</html>

Here你可以在这个例子中找到关于clearInterval的更多信息。

希望它有所帮助！

Answer 2

要停止间隔和动画，您需要使用clearInterval（在区间ID上）和.stop()（在元素上）。

例如：

clearInterval(blurb_scroll);
$(".content .blurb-container:first").stop();

Answer 3

你应该根据jquery文档使用clearInterval和jquery .stop（）函数http://api.jquery.com/stop/

同样如jquery所述，通过将属性$ .fx.off设置为true，可以全局停止动画。完成此操作后，所有动画方法都会在调用时立即将元素设置为最终状态，而不是显示效果。

Answer 4

而不是清除setInterval间隔，而是开始使用setTimeout：

(function runthis() {
  var f = $(".content .blurb-container:first")
  f.next()
   .css({'opacity':0})
   .delay(400)
   .animate({'opacity':1}, 'fast')
   .animate({'margin-top':'-190px', 'opacity':'0'}, 'slow', function(){
     $(this).appendTo(blurb_container).removeAttr('style');
   });
  if (conditional that says we should keep doing this) {
    setTimeout(runthis, 6000);
  }
}());

现在你可以更好地控制发生的事情，如果你的代码有错误，至少它不会永远运行你的错误代码。如果它因错误而死亡，您永远不会安排新的超时。

的setInterval。只是不是一个好主意。

在运行javascript时停止setInterval

4 个答案: