Question

我试图修复但失败了。

<!-- The navigation bar is created here -->
<div class="nav">
  <ul>
    <li><a class="active" href="index.html">Home</a></li>
    <li><a href="games.html">Games</a></li>
    <li><a href="contact.html">Contact Us</a></li>
  </ul>
</div>

function ShowTime() {
  var now = new Date();
  var tomorrow = new Date();
  tomorrow.setDate(today.getDate() + 1);
  var hrs = 17 - now.getHours();
  var mins = 30 - now.getMinutes();
  var secs = 60 - now.getSeconds();
  if (hrs < 0) {
    var hrs = 17 - tomorrow.getHours();
    var mins = 30 - tomorrow.getMinutes();
    var secs = 60 - tomorrow.getSeconds();
  }
  timeLeft = "" + hrs + ' hours ' + mins + ' minutes ' + secs + ' seconds';
  $("#countdown").html(timeLeft);
}

ShowTime();
var countdown = setInterval(ShowTime, 1000);

Answer 1

你的算术被打破了。

每次时钟滴答时，都会生成一个新日期。如果是18:00，那么：

var hrs = 17 - now.getHours();

会消极，所以你会这样做：

var hrs = 17 - tomorrow.getHours();

但是会产生-1。你想要做的是为结束时间创建一个日期，然后从中减去当前日期并将结果（毫秒）解析为小时，分钟和秒。

我不知道分钟和秒的调整是什么，它们对我没有意义。以下内容对您的代码进行了少量调整：

function ShowTime() {
  var now = new Date();
  var end = new Date(+now);
  var endHour = 17;
  end.setHours(endHour,0,0,0);

  // If past end, set to tomorrow
  if (now >= end) {
    end.setDate(end.getDate() + 1);
  }

  console.log('Counting down to ' + end.toString());
  
  // Get difference and divide into hr, min, sec
  var diff = end - now;
  var hrs = diff / 3.6e6 | 0;
  var mins = (diff % 3.6e6)/ 6e4 | 0;
  var secs = (diff % 6e4) / 1000 | 0;
  
  // Format and write to document
  timeLeft = "" + hrs + ' hours ' + mins + ' minutes ' + secs + ' seconds';
  document.getElementById('countdown').innerHTML = timeLeft;
}

ShowTime();
var countdown = setInterval(ShowTime, 1000);

<div id="countdown"></div>

如果你试图倒计时说17:30，那么引入一个 endMin 变量，如：

  var endHour = 17;
  var endMin  = 30;
  end.setHours(endHour, endMin, 0, 0);

  // If past end hour, set to tomorrow
  if (now > end) {

Answer 2

当您想要停止计时时，需要致电clearInterval(countdown);。根据clearInterval docs on MDN

WindowOrWorkerGlobalScope mixin的clearInterval（）方法取消了之前通过调用setInterval（）建立的定时重复操作。

此外，我相信您提供的代码需要更改为tomorrow.setDate(now.getDate() + 1);而不是tomorrow.setDate(today.getDate() + 1);

Answer 3

您现在定义了一个变量并在今天查找，因此它没有显示倒计时

新html如下所示

<div id="countdown"></div>

和新的js将如下所示

function ShowTime() {
var today= new Date();
var tomorrow = new Date();
tomorrow.setDate(today.getDate()+1);
var hrs = 17-now.getHours();
var mins = 30-now.getMinutes();
var secs = 60-now.getSeconds();
if(hrs < 0) {
var hrs = 17-tomorrow.getHours();
var mins = 30-tomorrow.getMinutes();
var secs = 60-tomorrow.getSeconds();
}
  timeLeft = "" +hrs+' hours '+mins+' minutes '+secs+' seconds';
$("#countdown").html(timeLeft);
}

ShowTime();
var countdown = setInterval(ShowTime ,1000);

Answer 4

我从之前的笔记中找到了这个，但我无法在SO中找到问题的链接。

<font size=1><p id='demo'></font>

<script src="path/to/jquery.js"></script> 
<script>
    // Set the date we're counting down to
    //var insert1="<?php echo $insert1; ?>";
    //var timeout1="<?php echo $timeout1; ?>";
    var insert1="05/23/2017 00:00:00";
    var timeout1="05/25/2017 00:00:00";

    // Update the count down every 1 second
    var x = setInterval(function() {
        var countDownDate = new Date(timeout1).getTime();
        var countDownDates = new Date().getTime();
        // Get todays date and time

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

        // 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 = "Time out";
        }
    }, 1000);
</script>

Javascript时钟变为负面

4 个答案: