javascript - 分钟与秒不太同步

Question

我有一个正在测试的计时器，似乎在分钟倒计时减少 1 秒和达到 59 秒时的秒数之间存在一些偏差 () 即每分钟:-

我怎样才能改变它以使它们同步？

我的代码如下:-

$(document).ready(function() {
  function now() {
    return window.performance ? window.performance.now() : Date.now();
  }

  function tick() {
    var timeRemaining = countdown - ((now() - initTick) / 1000);
    timeRemaining = timeRemaining >= 0 ? timeRemaining : 0;

    var countdownMinutes = Math.floor(timeRemaining / 60);
    var countdownSeconds = timeRemaining.toFixed() % 60;

    countdownTimer.innerHTML = countdownMinutes + ":" + countdownSeconds;

    if (countdownSeconds < 10) {
      countdownTimer.innerHTML = countdownMinutes + ":" + 0 + countdownSeconds;
    }

    if (timeRemaining > 0) {
      setTimeout(tick, delay);
    }
  }

  var countdown = 600; // time in seconds until user may login again
  var delay = 20; // time (in ms) per tick
  var initTick = now(); // timestamp (in ms) when script is initialized
  var countdownTimer = document.querySelector(".timer"); // element to have countdown written to
  setTimeout(tick, delay);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<div class="timer"></div>

js fiddle :https://jsfiddle.net/robbiemcmullen/cer8qemt/1/

Answer 1

问题是分钟和秒的精度不同。

您需要四舍五入到 /60/%60 之前最接近的秒数。

考虑:还剩 9 分钟:

var x = 540; 
console.log(x.toFixed() % 60, Math.floor(x / 60));` 

输出为:(0,9)

然后考虑 20 毫秒后的调用:

var x = 539.980; 
console.log(x.toFixed() % 60, Math.floor(x / 60));

现在的输出是:(0, 8)。

所以秒还没有改变，但分钟改变了。