Javascript 倒计时运行

Question

大家好，我有一个时间计数器，我想从 15 数到 0。但是当前版本是从 0 到 15。它应该是运行倒数。有什么建议吗？

  // Set the minutes
  var countDownMins = new Date().getMinutes() + 15;

  // Update the count down every 1 second
  var x = setInterval(function() {

    // Get current time
    var now = new Date().getTime();

    var distance =  now + countDownMins;

    mins = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    secs = Math.floor((distance % (1000 * 60)) / 1000);        

    // Output the results
    document.getElementById("minutes").innerHTML = mins;
    document.getElementById("seconds").innerHTML = secs;

    if (mins < 0) {
      clearInterval(x);
    }

  }, 1000);

Answer 1

一些小的修改应该可以很好地工作！

您可以像这样将倒数计时器保存到本地存储：

var countDownTarget = localStorage.getItem('countDownTarget');
if (!countDownTarget) {
    countDownTarget = new Date().getTime() + 15 * 60 * 1000;;
    localStorage.setItem('countDownTarget', countDownTarget);
}

var countDownTarget = new Date().getTime() + 15 * 60 * 1000;

function showClock(target) {
    const distance = target - new Date().getTime();
    const mins = distance < 0 ? 0: Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    const secs = distance < 0 ? 0: Math.floor((distance % (1000 * 60)) / 1000);        

    // Output the results
    document.getElementById("minutes").innerHTML = mins;
    document.getElementById("seconds").innerHTML = secs;
}

showClock(countDownTarget);

// Update the count down every 1 second
var x = setInterval(function() {
    showClock(countDownTarget);
    if (countDownTarget - new Date().getTime() < 0) {
        clearInterval(x);
    }
}, 1000);

Minutes: <b id="minutes"></b>
Seconds: <b id="seconds"></b>

Answer 2

试试这个方法

// Set the minutes
var countDownMins = new Date().getTime() + (1000 * 60 * 15);

// Update the count down every 1 second
var x = setInterval(function() {

 // Get current time
 var now = new Date().getTime();

 var distance = countDownMins - now;

 mins = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
 secs = Math.floor((distance % (1000 * 60)) / 1000);        

 // Output the results
 document.getElementById("minutes").innerHTML = mins;
 document.getElementById("seconds").innerHTML = secs;

 if (mins < 0) {
   clearInterval(x);
 }

}, 1000);

Javascript 倒计时运行

Javascript time counter running backwards

javascript

counter

timer

Javascript 倒计时 运行

Javascript time counter running backwards

javascript

counter

timer

Javascript 倒计时运行