设置倒数计时器，然后显示投票打开，然后投票时间显示投票结束

Question

这是我的代码在我目前的程序。我有一个倒计时计时器的运行代码，现在我的问题是投票时间结束时我想显示投票结束，而不是总是显示投票打开。

<script> 
// Set the date we're counting down to 
var countDownDate = new Date("<?php echo $countdown['datestart']; ?>").getTime(); 
var endDate = new date("<?php echo $countdown['dateend']; ?>").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.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 
if (distance < 0) { 
    clearInterval(x); 
    document.getElementById("demo").innerHTML = "Voting now Opens"; 
} 

// If date end is over display some text 
    //display voting period ends 

}, 1000); 
</script> 

Answer 1

要添加结束投票消息，您需要继续间隔，直到投票结束。为了使事情变得更简单，我们使用if ... else if ... else将代码分成3个部分。在其中的每一个中，我们都处理该场景的相应显示。当不需要时，它还具有不进行计算的额外好处。

如果距离> 0，表决尚未开始。 如果endDate>现在，表决尚未结束。我假设PHP输出结果会为此场景提供准确的日期。 Read more。 任何其他情况意味着投票结束。

<script> 
// Set the date we're counting down to 
var countDownDate = new Date("<?php echo $countdown['datestart']; ?>").getTime(); 
var endDate = new Date("<?php echo $countdown['dateend']; ?>").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; 

    if (distance > 0) { 
    // 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 "; 
    } 
    else if (endDate > now) { 
    // If the count down is over, write some text 
    document.getElementById("demo").innerHTML = "Voting now Opens"; 
    } 
    else { 
    // If date end is over display some text 
    //display voting period ends 
    document.getElementById("demo").innerHTML = "Voting Ended"; 
    clearInterval(x); 
    } 
}, 1000); 
</script> 

Answer 2

一目了然，我可以看到你的“结束日期”行有一个错误：

var endDate = new date(..... 

应该日期以大写“d”为对于VAR countDownDate即

var endDate = new Date(..... 

假设代码的其余部分是正确的（它似乎确定） - 应该没问题。

如果没有解决它 - 从你的问题很容易破译，如果下面的函数总是解析为false，因此永远不会触发封闭的代码，它会清除'x'间隔并显示投票是开放的。

if (distance < 0) {...} 

如果我还能做什么是console.log(countDownDate);，console.log(now);为什么不也console.log(distance);理想immidiately宣布后：

// Find the distance between now an the count down date 
var distance = countDownDate - now; 

，如果你不知道如何使用console.log()功能，请参考以下链接：https://developers.google.com/web/tools/chrome-devtools/console/