Question

所以我用这样的格式制作了一个简单的计时器：MM：SS.MS

你可以在这里查看[删除]
它在chrome，IE等方面运行良好，但在Firefox中，秒数就像是两倍......

我看了一些其他的秒表，但我不放弃了解它们。什么是最好的方法呢？现在我有一个10ms的间隔，它会产生计时器。

该功能看起来像这样，我希望这是可以理解的：

var state = false;
var msTimer = null;

var min = document.getElementById("min");
var sec = document.getElementById("sec");
var ms = document.getElementById("ms");

var minCount = 0;
var secCount = 0;
var msCount = 0;


document.onkeydown = function timer(e) {

if (!e) { e = window.event; }

if (e.keyCode == "32") {

    if (state == false) {
        state = true;

        min.innerHTML = "00";
        sec.innerHTML = "00";
        ms.innerHTML = "00";

        msTimer = window.setInterval(function() {
            if (msCount == 99) {

                msCount = 0;
                secCount++;

                // Minutes
                if (secCount == 60) {

                    secCount = 0;
                    minCount++;

                    if (minCount <= 9)
                    { min.innerHTML = "0" + minCount; }
                    else
                    { min.innerHTML = minCount; }
                }

                // Seconds
                if (secCount <= 9)
                { sec.innerHTML = "0" + secCount; }
                else
                { sec.innerHTML = secCount; }

            } else { msCount++; }

            // Miliseconds
            if (msCount <= 9)
            { ms.innerHTML = "0" + msCount; }
            else
            { ms.innerHTML = msCount; }

            // 1 Hour
            if (minCount == 60) {

                clearInterval(msTimer);

                min.innerHTML = "N0";
                sec.innerHTML = "00";
                ms.innerHTML = "0B";

                state = false;

                minCount = 0;
                secCount = 0;
                msCount = 0;
            }
        }, 10);

    } else if (state == true) {
        state = false;

        clearInterval(msTimer);

        minCount = 0;
        secCount = 0;
        msCount = 0;
    }
}

感谢您的任何建议：）

编辑：

顺便说一下，如果我从计时器中删除所有样式，它在firefox中会更顺畅。但这不是解决方案..

Answer 1

您不应该依赖计时器的间隔完全 10ms。如果您将每个计时器刻度视为刷新屏幕上计时器的请求会更好，但是从系统时钟或类似事件中获取测量值。

然而，无论机器（和JS实现）是慢还是忙，你总能看到一个准确的计时器¹ - 只是一个不经常更新的计时器。

¹当然，这只会与系统时钟一样准确。如果Javascript可以访问.NET的Stopwatch类或Java的System.nanoTime()方法等高性能计时器，那么最好使用它。

Answer 2

无法保证Javascript中的时间安排。 10ms的间隔时间大约只有10ms，最有可能每次都会延迟很短的时间。在Javascript中执行计时器的正确方法是在启动计时器时保存启动时间戳，然后每隔10ms左右计算启动时间戳和当前时间之间的差异，并使用格式化值更新页面上的元素。

10ms间隔与Firefox

2 个答案: