Javascript:知道实际的一秒何时被勾选？

Question

我有一个 setInterval 函数，它显示我网站上某个事件的剩余时间。但倒计时与秒的实际滴答声不同步。

我的代码使用 ajax 调用服务器来获取一次到期日期，成功后倒计时将开始。直到那里都很棒。

var request = new XMLHttpRequest();
request.open('GET', 'https://my-website/service.php', true);
request.onload = function() {
    if (request.status >= 200 && request.status < 400) {

        date = request.responseText;
        timer = setInterval(showRemaining, 1000);//start the countdown

    } else {
        // We reached our target server, but it returned an error
    }
};

但是调用setInterval的时间需要与秒的实际全局tick同步。

(我希望我说得有道理。我的意思是，调用需要与电脑或手机时钟的每一秒同步!)

我怎样才能实现这一目标？提前致谢!

Answer 1

您需要使用当前毫秒和下一个毫秒之间的差异来创建一个初始 setTimeout，即:

1000-(new Date().getMilliseconds())) 

然后就可以开始setInterval了

注意setTimeout/setInterval有一个最小值(一般认为是10ms)，所以如果到下一秒小于该值，则加1000。

另请注意，setTimeout/setInterval 并非 100% 准确，但最接近的秒数可能就足够了。

这给出了您的成功代码:

 date = request.responseText; 

 var t = 1000-(new Date().getMilliseconds());
 if (t < 15) t+=1000;

 setTimeout(function() {
     timer = setInterval(showRemaining, 1000);//start the countdown
 }, t));