Question

我有以下代码。我希望当这个计时器到期时，另一个计时器应该启动而不是过期的文本。

var countDownDate = new Date("Oct 25, 2017 15:37:25").getTime();

var x = setInterval(function() {

    var now = new Date().getTime();

    var distance = countDownDate - now;
    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((distance % (1000 * 60)) / 1000);

    document.getElementById("demo").innerHTML = days + " Days " + hours + " Hrs "
    + minutes + " Min " + seconds + " Sec ";

    if (distance < 0) {
        clearInterval(x);
        document.getElementById("demo").innerHTML = "T**imer Expired - instead of this another timer**";
    }
}, 1000);

Answer 1

这段代码可以解决问题。每次计数器变为0时，您将计数重新定义为countDownDate和Now之间的最初时间。如果此数量是可变的，您可以修改distanceToAdd的分配

 
 // Changed the value to reach for the demo
 var countDownDate = new Date().getTime() + 20000;
     // Fixed Value to add each time the counter get to 0
     var distanceToAdd = countDownDate - new Date().getTime();   

 var x = setInterval(function() {

    var now = new Date().getTime();

    var distance = countDownDate - now;
    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((distance % (1000 * 60)) / 1000);

    if (distance < 0) {
        //Add Time to your timer goal instead of canceling interval
        countDownDate += distanceToAdd;
    }
    else {
        document.getElementById("demo").innerHTML = days + "        Days " + hours + " Hrs "
        + minutes + " Min " + seconds + " Sec ";
    }
}, 1000);

 <html>
	<head>
	</head>
	<body>
	
	<div id="demo"></div>
	
</body>
</html>

Answer 2

创建一个函数，并在每次计时器完成时调用它。

＆＃13;

$(document).ready(function() {
  var i = 1 ;
  setTimer(i) ;
}) ;


function setTimer(i) {
  var countDownDate = new Date().getTime() + 3000 ;

  var x = setInterval(function() {
      var now = new Date().getTime() ;

      var distance = countDownDate - now ;

      if (distance < 0) {
          clearInterval(x);
          console.log("Timer " + i + " Finished. New Timer Stated!") ;
          setTimer(i+1) ;
      }
      else {
      console.log("Timer " + i + " Running") ;
      }
  }, 1000);
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

倒数计时器到期开始不同的倒计时

2 个答案: