迷失了制作秒表的尝试

Question

我正在尝试自学 JavaScript 并且在用秒表做一些文本时我迷失了这个问题。它正在工作，但它总是从 95:34:47 而不是 00:00:00

开始

这是我到目前为止尝试过的方法。

    <script>
        /*Timer Stuff*/
        function pad(num, size) {
            var s = "0000" + num;
            return s.substr(s.length - size);
        } 
        function formatTime(time) {
            var h = m = s = ms = 0;
            var newTime = '';

            h = Math.floor( time / (60 * 60 * 1000) );
            time = time % (60 * 60 * 1000);
            m = Math.floor( time / (60 * 1000) );
            time = time % (60 * 1000);
            s = Math.floor( time / 1000 );
            ms = time % 1000;

            newTime = pad(h, 2) + ':' + pad(m, 2) + ':' + pad(s, 2) + ':' + pad(ms, 3);
            return newTime;
        } 

        function update() {
            var d = new Date();
            var n = d.getTime();
            document.getElementById("time").innerHTML = formatTime(n);
        }

        function start() {
            MyVar = setInterval(update, 1);
        }
    </script>
</head>
<body>
        <div>Time: <span id="time"></span></div>
        <input type="button" value="start" onclick="start();">
</body>

我知道我需要减去特定的时间量才能准确匹配计时器，但我不知道该怎么做。

Answer 1

你必须引入一个开始时间变量。在每个更新步骤中，您必须了解从开始到现在的差异。

对于您的代码：

    <script>
    /*Timer Stuff*/
    timestart = new Date();
    timestart_time = timestart.getTime();

    function pad(num, size) {
        var s = "0000" + num;
        return s.substr(s.length - size);
    } 
    function formatTime(time) {
        time = time -timestart_time;
        var h = m = s = ms = 0;
        var newTime = '';

        h = Math.floor( time / (60 * 60 * 1000) );
        time = time % (60 * 60 * 1000);
        m = Math.floor( time / (60 * 1000) );
        time = time % (60 * 1000);
        s = Math.floor( time / 1000 );
        ms = time % 1000;

        newTime = pad(h, 2) + ':' + pad(m, 2) + ':' + pad(s, 2) + ':' + pad(ms, 3);
        return newTime;
    } 

    function update() {
        var d = new Date();
        var n = d.getTime();
        document.getElementById("time").innerHTML = formatTime(n);
    }

        function start() {
            MyVar = setInterval(update, 1);
        }
    </script>
</head>
<body>
        <div>Time: <span id="time"></span></div>
        <input type="button" value="start" onclick="start();">
</body>

这对我有用:)

Answer 2

您需要用开始时间存储一个变量，然后从中减去。你得到的 95 小时实际上要高得多，只是被裁剪了，因为你是从 Unix 纪元开始计算的。

我会这样做：

    function update() {
        var d = new Date();
        var n = d - startTime;
        document.getElementById("time").innerHTML = formatTime(n);
    }

    function start() {
        startTime = new Date();
        MyVar = setInterval(update, 1);
    }

请注意，您甚至不需要在减法时使用 d.getTime()——您只需减去 Date 个对象本身即可。

迷失了制作秒表的尝试

Lost trying to create a stopwatch

javascript

stopwatch