0

我正在尝试创建一个尽可能准确的毫秒秒表。当然，浏览器/服务器/cpu 或任何需要超过 1 毫秒的时间才能执行该功能并在手表上显示数字。所以我想我想每增加一秒就将 ms 重置为 0。jQuery 代码看起来像这样。

(function($) {
    $.fn.stopwatch = function() {

        // The Element where the HTML code is added
        var clock = $(this);

        var timestamprunningms;
        var timestampstartms;

        var milliseconds = 0;
        // Predefinition of the timestamprunningseconds variable
        var timestamprunningseconds;

        var display = clock.find("#display");

        var time = clock.find("#time");

        // Predefinition of the seconds variable 
        // Value 0 because it is used to define
        // The timestampstartseconds variable in the click-event
        var seconds = 0;

        // Predefinition for the timestampstartseconds variable
        var timestampstartseconds;

        // Predefinition for the timer variable
        var timer;

        // Time Variables
        var h = clock.find("#h");
        var m = clock.find("#m");
        var s = clock.find("#s");
        var ms = clock.find("#ms");

        // Button Variables
        var resetlog = clock.find("#resetlog")
        var showms = clock.find("#showms")
        var hidems = clock.find("#hidems")
        var start = clock.find("#start");
        var pause = clock.find("#pause");
        var reset = clock.find("#reset");
        var log = clock.find("#log");

        ms.hide();
        resetlog.click(function (){
            time.html("");
        });

        // Hides the pause and hidems Button
        pause.hide();
        hidems.hide();
        // Triggered by clicking the start button
        start.click(function() {

            // Hides the start and shows the pause button
            start.hide(),
            pause.show(),

            // Defines the value of timestampstartseconds or saves it 
            // if there is a value in seconds
            timestampstartseconds = Math.round(new Date().getTime() / 1000) - seconds;
            timestampstartms = new Date().getTime() - milliseconds;
            timer = setInterval(do_time, 20);
        });

        // Triggered by clicking the pause button
        pause.click(function() {

            // Resets the interval in which the do_time function occurs
            clearInterval(timer),

            // Hides the pause and shows the start button
            pause.hide(),
            start.show(),
            timer = 0;
        });

        // Triggered by clicking the reset button
        reset.click(function() {

            // Resets the interval in which the do_time function occurs
            clearInterval(timer),

            // Resets the value of the display
            h.html("00"),
            m.html("00"),
            s.html("00"),
            ms.html("000")

            // Hides the pause and shows the start button
            pause.hide(),
            start.show();
            seconds = 0;


        });

        log.click(function() {
            time.append("<li>" + display.text() + "</li>");
        });
        // The function for calculating the seconds/minutes/hours

        showms.click(function() {
            showms.hide();
            hidems.show();
            ms.show();

        });

        hidems.click(function() {
            hidems.hide();
            showms.show();
            ms.hide();

        });
        function do_time() {

            // Timestamp that refreshes everytime the function is executed
            timestamprunningseconds = Math.round(new Date().getTime() / 1000);
            timestamprunningms = new Date().getTime();
            // The actual seconds that are going to be displayed
            milliseconds = timestamprunningms - timestampstartms;
            seconds = timestamprunningseconds - timestampstartseconds;

            // Value of the display
            var hour = parseFloat(h.text());
            var minute = parseFloat(m.text());
                if (milliseconds > 999) {
                    milliseconds = 0;
                    timestampstartms = new Date().getTime();
                }

                // Reset seconds display and add a minute every time 60 seconds pass
                if (seconds > 59) {
                    seconds = 0;
                    timestampstartseconds = Math.round(new Date().getTime() / 1000);
                    minute++;

                }

                // Reset minute display and add an hour every time 60 minutes pass
                if (minute > 59) {
                    minute = 0;
                    hour++;

                }

                // Display value
                 h.html("0".substring(hour >= 10) + hour);
                 m.html("0".substring(minute >= 10) + minute);
                 s.html("0".substring(seconds >= 10) + seconds.toString());
                 ms.html(":" + "0".substring(milliseconds >= 100) +"0".substring(milliseconds >= 10) + milliseconds.toString());
            };
        };

})(jQuery);

正如我已经说过的，我的目标是每增加一秒就重置毫秒计时器。（秒是准确的，毫秒不是）。

会是这样吗？：

while (seconds++) {
                    milliseconds = 0;
                    timestampstartms = new Date().getTime();
                }

我对 javascript/jQuery 和一般编程真的很陌生，所以如果你能帮助我解决这个问题，也许会给我一些反馈，这样我就可以改进了。

4

1 回答 1

0

好的，我找到了一个解决方案：我刚刚添加了一个变量，它就像当前秒的时间戳。它的默认值为 0，如果显示中使用的秒数大于第二个时间戳，则它会上升 1。

看起来有点像这样：（var secondnow = 0;在 jQuery 函数之上）

这就是它的使用方式

if (seconds > secondnow) {
                    milliseconds = 0;
                    secondnow++;
                    timestampstartms = new Date().getTime();
                    console.log(secondnow);
                }

（在函数 do_time 中）

于 2013-08-16T06:35:37.830 回答