停止javascript倒计时

Stop javascript countdown

本文关键字:倒计时 javascript 停止      更新时间:2023-09-26

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

我已经从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);
});

您必须使用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);
});