时间戳

首页 > 解决方案 > SetInterval 的替代方法是什么？

javascript - SetInterval 的替代方法是什么？

问题描述

我写了一个倒计时 24 小时计时器，但它很慢，有时我的系统时钟和计时器之间的时间差达到 2 小时。我想知道是否有 setinterval 的替代方法，我将它放在我的代码中。

var _tick = setInterval(function() {
    if ((remSeconds) > 0) {
      if (hoursCounter > 0) {
        if (minutesCounter == 0 && secondsCounter == 0) {
          minutesCounter = 60;
          hoursCounter = hoursCounter - 1;
        }
      }
      if (secondsCounter == 0) {
        secondsCounter = 60;
        minutesCounter = minutesCounter - 1;
      }
      secondsCounter = secondsCounter - 1;
      remSeconds = remSeconds - 1;

      $seconds.text(formatNumber(secondsCounter));
      $minutes.text(formatNumber(minutesCounter));
      $hours.text(formatNumber(hoursCounter));
    } else {
      clearInterval(_tick);
      document.getElementById("tRemaining").innerHTML = "EXPIRED";
    }
  },
  1000);

标签： javascriptjquery

解决方案

你可以这样做：

var startTime = Date.now();
var duration = 1000*60*60*24;  // set duration to 24h

var _tick = setInterval(function() {
   let remSeconds = Math.floor((duration - (Date.now()-startTime))/1000);
   if ((remSeconds) > 0) {
      let remHours = Math.floor(remSeconds/3600);
      remSeconds -= remHours*3600;
      let remMins = Math.floor(remSeconds/60);
      remSeconds -= remMins*60;
      document.getElementById("tRemaining").innerHTML = remHours+':'+remMins+':'+remSeconds;
   } 
   else {
      clearInterval(_tick);
      document.getElementById("tRemaining").innerHTML = "EXPIRED";
   }
},
1000);
<div id="tRemaining"></div>

如果你想要一个干净的输出，你还需要添加一些东西来处理0填充，以避免类似的东西23:7:31，但必不可少的东西就在那里。

推荐阅读