Question

如何将“19:30”这样的确切时间添加到柜台并仍然显示“明天”，“今天”和“过期”消息？

因为当我添加“19:30:00”时，计数器不准确。

当我使用“Math.floor”代替“Math.ceil”时，计数器是准确的，但消息在他们应该的时候没有显示。

<!DOCTYPE HTML>
<html>
    <head>
        <style>
        p {
          text-align: center;
          font-size: 60px;
        }
        </style>
    </head>
    <body>

        <p id="demo"></p>

        <script>
        // Set the date we're counting down to
        var countDownDate = new Date("Dec 18, 2017 19:30:00").getTime();

        // Update the count down every 1 second
        var x = setInterval(function() {

            // Get todays date and time
            var now = new Date().getTime();

            // Find the distance between now an the count down date
            var distance = countDownDate - now;

            // Time calculations for days, hours, minutes and seconds
            var days = Math.ceil(distance / (1000 * 60 * 60 * 24));
            var hours = Math.ceil((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
            var minutes = Math.ceil((distance % (1000 * 60 * 60)) / (1000 * 60));
            var seconds = Math.ceil((distance % (1000 * 60)) / 1000);

            // Output the result in an element with id="demo"
            document.getElementById("demo").innerHTML = days + "d " + hours + "h "
            + minutes + "m " + seconds + "s ";

            // If the count down is over, write some text 

            console.log(days);
            if (days === 1) {
                clearInterval(x);
                document.getElementById("demo").innerHTML = "TOMORROW";
            }  
            if (days === 0) {
                clearInterval(x);
                document.getElementById("demo").innerHTML = "TODAY";
            }   
            if (days < 0) {
                clearInterval(x);
                document.getElementById("demo").innerHTML = "EXPIRED";
            }       

        }, 1000);
        </script>

    </body>
</html>

Answer 1

这应该有效

＆＃13;

// Set the date we're counting down to
var countDownDate = new Date("Dec 3, 2017 19:30:00");

// Update the count down every 1 second
var x = setInterval(function() {

  // Get todays date and time
  var now = new Date();

  // Find the distance between now an the count down date
  var distance = countDownDate.getTime() - now.getTime();

  // Time calculations for days, hours, minutes and seconds
  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);

  // Output the result in an element with id="demo"
  document.getElementById("demo").innerHTML = days + "d " + hours + "h " +
    minutes + "m " + seconds + "s ";

  // If the count down is over, write some text 

  console.log(days);
  var tomorrow = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 1);
  if (tomorrow.getFullYear() == countDownDate.getFullYear() && tomorrow.getMonth() == countDownDate.getMonth() && tomorrow.getDate() == countDownDate.getDate()) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "TOMORROW";
  } else if (now.getFullYear() == countDownDate.getFullYear() && now.getMonth() == countDownDate.getMonth() && now.getDate() == countDownDate.getDate()) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "TODAY";
  } else if (countDownDate.getTime() < now.getTime()) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "EXPIRED";
  }

}, 1000);

＆＃13;

p {
  text-align: center;
  font-size: 60px;
}

＆＃13;

<p id="demo"></p>

＆＃13;

如何在倒数计时器上添加确切时间到日期？

1 个答案: