4

我有一个这样的javascript程序：

function addtime() {
  curtime = document.getElementById("time").value * 1000;
  curtime += 1;
  document.getElementById("time").value = curtime / 1000;
}
setInterval(function () {
  addtime();
}, 1);

您可能在我的代码中看到我乘以 1000 然后除以 1000，这是因为我想每次增加一毫秒，但在“时间”输出 div 中显示秒数。但是，当我打开其中包含此代码的页面时，如果您理解我的意思，一秒钟实际上并不是“一秒钟”。它目前比正常秒长三倍，我不知道为什么。

那么我的代码有什么问题，我能做些什么来解决它？

谢谢

卢卡斯

4

4 回答 4

4

问题是 JavaScript 不能保证在您指定的准确时间调用 setInterval，而是在该时间过去后第一次有机会调用。此外，在许多（所有？）浏览器的分辨率下，1ms 是 waaaay。

要正确执行此操作，请获取开始时间，然后通过减去当前时间找出经过的毫秒数。

var start = new Date();
var update = function() {
    var now = new Date();
    var elapsed = now - start;
    // now you can do something with `elapsed`,
    // like stuff it into the UI
};
setInterval(update, 100);
于 2012-04-12T07:58:08.000 回答
3

这是一个视频，其中 J. Resig 解释了 JavaScript 如何具有不准确的计时器，在他关于在测试中使用计时器的演示文稿的上下文中。

“OSX 计时器精确到毫秒。但在 Windows 中，计时器仅每 15 毫秒更新一次。”

这是 N. Zakas 的另一篇文章，指出计时器分辨率在某些情况下是不同的，它也取决于浏览器。1ms 的分辨率很快，但它会占用 CPU 处理时间，这就是浏览器将其拉回的原因。据我所知，当标签不在焦点上时，浏览器会降低计时器（以及渲染）。

我在 chrome 中看到了很多，尤其是在慢速 PC 中，在同一页面上一次打开 4 个选项卡，只有焦点中的一个首先呈现（顺时针快速图标），而其他人继续加载（逆时针加载图标）。

于 2012-04-12T08:02:35.103 回答
1

如果您想要一秒的间隔，请设置一秒的间隔，而不是按毫秒增加时间，按秒增加。然后你也可以简化你的值更新代码。

见这里http://jsfiddle.net/NGTXU/

setInterval(function () {
   document.getElementById("time").value++;
},1000);
于 2012-04-12T08:03:55.930 回答
0

因为setInterval以毫秒为参数，我认为你应该替换1为1000

function addtime() {
  curtime = document.getElementById("time").value * 1000;
  curtime += 1;
  document.getElementById("time").value = curtime / 1000;
}
setInterval(function () {
  addtime();
}, 1000);
于 2012-04-12T08:00:57.877 回答