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

Question

How can i add the exact time like "19:30" to the counter and still show "Tomorrow", "Today" and "Expired" messages? 如何将精确的时间（例如“ 19:30”）添加到计数器，并仍然显示“明天”，“今天”和“过期”消息？

Because when i add "19:30:00" the counter is not accurate. 因为当我添加“ 19:30:00”时，计数器不准确。

When i use "Math.floor" instead of "Math.ceil" the counter is accurate but the messages not showen at the time they should. 当我使用“ 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

This should work 这应该工作

 // 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);

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

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

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

问题描述

1 个解决方案

解决方案1
0 已采纳 2017-12-01 12:08:20

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

问题描述

1 个解决方案

解决方案1 0 已采纳 2017-12-01 12:08:20

解决方案1
0 已采纳 2017-12-01 12:08:20