Question

我正在尝试使用javascript制作倒计时脚本。但我有一个问题，stoped倒计时。

我已从codepen.io

创建了 DEMO

在这个演示中你可以看到页面加载后倒计时将开始没有问题。但是如果你在fadeOut倒计时之后在开发者控制台中查看它，那么你可以看到倒计时仍然是-1，-2，-3，... ...

我的问题是如何在fadeOut之后停止倒计时？

JS

$(document).ready(function() {
   var sec = 5
   var timer = setInterval(function() {
      $("#mdtimer span").text(sec--);
      if (sec == 0) {
         $("#makingdifferenttimer").delay(1000).fadeIn(1000);
         $("#mdtimer").hide(1000).fadeOut(fast);
      }
   }, 1000);
});

Answer 1

你必须使用clearInterval()函数来停止fadeOut回调中的计时器：

clearInterval(timer);

请参阅fadeOut() complete选项。

您的更新示例：

$(document).ready(function() {
   var sec = 5
   var timer = setInterval(function() {
      $("#mdtimer span").text(sec--);
      if (sec == 0) {
         $("#makingdifferenttimer").delay(1000).fadeIn(1000);
         $("#mdtimer").hide(1000).fadeOut(500, function() {
            clearInterval(timer);
         });
      }
   }, 1000);
});

停止javascript倒计时

1 个答案: