每隔一分钟运行JS功能

Axe*_*l K 1 javascript time function timing updates

所以我有这个JavaScript时钟,我正在努力,我希望它与客户的系统时钟完全同步.我知道如何使用Date对象获取当前时间,我知道如何每60000毫秒(1分钟)运行更新功能.问题是客户端可能在半分钟已经过去时加载页面,使时钟滞后30秒.当分钟变量实际发生变化时,有没有办法只运行更新功能?(我只想要精确度.)

我如何获得当前时间:

var time = new Date();
var currentHour = time.getHours();
var currentMinute = time.getMinutes();
Run Code Online (Sandbox Code Playgroud)

我如何每60000毫秒运行更新功能:

setInterval(update,60000); //"update" is the function that is run
Run Code Online (Sandbox Code Playgroud)

tym*_*eJV 10

当用户登录时,获取当前时间和分钟,减去60得到剩余秒数,然后相乘以设置定时器

var time = new Date(),
    secondsRemaining = (60 - time.getSeconds()) * 1000;

setTimeout(function() {
    setInterval(update, 60000);
}, secondsRemaining);
Run Code Online (Sandbox Code Playgroud)

  • 你只是错过了第一次调用。`setTimeout` 中应该有一个 `update();` 调用,因为 `setInterval` 将在第一次调用之前等待完整的 `60000`。 (2认同)

jfr*_*d00 6

首先,您必须了解javascript中的计时器不能保证按时调用,因此您无法在任何时候完全同步 - javascript只是不是那样的实时语言.它是单线程的,因此定时器事件必须等待在执行定时器之前可能正在执行的其他javascript.所以,你必须有一个尽可能保持尽可能好的设计,即使定时器被延迟(比它应该更晚调用).

如果您想尝试逗留接近一致,做最少的屏幕更新和最友好的移动电池寿命,我建议这种自调心的代码基础上的剩余,直到下一次的时间,这本身重新调整在每个tick分钟变化:

function runClock() {
    var now = new Date();
    var timeToNextTick = (60 - now.getSeconds()) * 1000 - now.getMilliseconds();
    setTimeout(function() {
        update();
        runClock();
    }, timeToNextTick);
}

// display the initial clock
update();
// start the running clock display that will update right on the minute change
runClock();
Run Code Online (Sandbox Code Playgroud)

这样做的好处是它只在下一分钟边界上调用一次更新.

工作演示:http://jsfiddle.net/jfriend00/u7Hc5/