每隔一分钟运行JS函数



所以我已经得到了这个JavaScript时钟我正在工作,我希望它与客户端的系统时钟完美同步。我知道如何使用Date对象获得当前时间,我知道如何每60000毫秒(1分钟)运行更新函数。问题是客户端可能在半分钟后加载页面,导致时钟滞后30秒。当分钟变量实际发生变化时,是否有任何方法可以运行更新函数?(我只想要分钟精度)

如何获得当前时间:

var time = new Date();
var currentHour = time.getHours();
var currentMinute = time.getMinutes();

如何每60000毫秒运行一次更新函数:

setInterval(update,60000); //"update" is the function that is run

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

var time = new Date(),
    secondsRemaining = (60 - time.getSeconds()) * 1000;
setTimeout(function() {
    setInterval(update, 60000);
}, secondsRemaining);

首先,你必须明白javascript中的计时器不能保证准时被调用,因此你不能在任何时候都完美同步——javascript不是一种实时语言。它是单线程的,所以计时器事件必须等待其他可能正在执行的javascript在计时器可以执行之前完成。所以,你必须有一个设计,即使计时器延迟(比它应该晚调用),仍然尽可能地做到最好。

如果你想尽量保持接近对齐,做最少的屏幕更新,并对移动电池寿命最友好,我建议这个自对齐代码,它根据剩余的时间在每个刻度上重新调整自己,直到下一分钟的变化:

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();

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

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

var time = new Date();
var currentHour = time.getHours();
var currentMinute = time.getMinutes();
var currentSecond   =   time.getSeconds();
var updateinterval = setInterval(startTimer,(60-currentSecond)*1000);
function startTimer(){
    clearInterval(updateinterval);
    setInterval(update,60000);
}
function update(){
    var time = new Date();
    console.log(time.getSeconds());
}

我将设置一个每秒运行的间隔,然后检查time.getSeconds() == 0。这样,您就可以根据客户端的时间,在新的一分钟开始时执行一个操作。

最新更新