使用javascript倒数计时器无法正确获取小时和分钟

Question

添加了用于显示仪式时间和小时数的javascript代码。天数正确，但小时数，分钟数无法正常工作。这是我使用的代码。

var deadline = new Date("May 1, 2019 03:30:00").getTime();
var x = setInterval(function() {
  var now = new Date().getTime();
  var t = deadline - now;
  var days = Math.floor(t / (1000 * 60 * 60 * 24));
  var hours = Math.floor((t % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((t % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((t % (1000 * 60)) / 1000);
  document.getElementById("day").innerHTML = days;
  document.getElementById("hour").innerHTML = hours;
  document.getElementById("minute").innerHTML = minutes;
  document.getElementById("second").innerHTML = seconds;
  if (t < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "TIME UP";
    document.getElementById("day").innerHTML = '0';
    document.getElementById("hour").innerHTML = '0';
    document.getElementById("minute").innerHTML = '0';
    document.getElementById("second").innerHTML = '0';
  }
}, 1000);

<div id="clockdiv">
  <div class="timerdays">
    <span class="days" id="day"></span>
    <div class="smalltext">Days</div>
  </div>
  <div class="timerdays">
    <span class="hours" id="hour"></span>
    <div class="smalltext">Hours</div>
  </div>
  <div class="timerdays">
    <span class="minutes" id="minute"></span>
    <div class="smalltext">Minutes</div>
  </div>
  <div class="timerdays">
    <span class="seconds" id="second"></span>
    <div class="smalltext">Seconds</div>
  </div>
</div>

确切的时间应该像这样41 days 984 hours 59040 minutes

小提琴链接：https://jsfiddle.net/zrvdt4fy/4/

Answer 1

跳过模运算：

var deadline = new Date("May 1, 2019 03:30:00").getTime();
var x = setInterval(function() {
  var now = new Date().getTime();
  var t = deadline - now;
  
  // change is happening from here...
  var days = Math.floor(t / (1000 * 60 * 60 * 24));
  var hours = Math.floor(t / (1000 * 60 * 60));
  var minutes = Math.floor(t / (1000 * 60));
  var seconds = Math.floor(t / 1000);
  // to here
  
  document.getElementById("day").innerHTML = days;
  document.getElementById("hour").innerHTML = hours;
  document.getElementById("minute").innerHTML = minutes;
  document.getElementById("second").innerHTML = seconds;
  if (t < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "TIME UP";
    document.getElementById("day").innerHTML = '0';
    document.getElementById("hour").innerHTML = '0';
    document.getElementById("minute").innerHTML = '0';
    document.getElementById("second").innerHTML = '0';
  }
}, 1000);

<div id="clockdiv">
  <div class="timerdays">
    <span class="days" id="day"></span>
    <div class="smalltext">Days</div>
  </div>
  <div class="timerdays">
    <span class="hours" id="hour"></span>
    <div class="smalltext">Hours</div>
  </div>
  <div class="timerdays">
    <span class="minutes" id="minute"></span>
    <div class="smalltext">Minutes</div>
  </div>
  <div class="timerdays">
    <span class="seconds" id="second"></span>
    <div class="smalltext">Seconds</div>
  </div>
</div>