Question

我在jQuery中发现这个有用的JS用于秒表，有秒，分和秒。 http://daokun.webs.com/jquery.stopwatch.js

事实上，小时计数器对我来说没用，我宁愿有一个毫秒计数器出现。我正在使用这个JS链接到一个按钮来启动它：

$('.easy').click(function(){ 
$("#demo").stopwatch().stopwatch('start');});

很容易成为按钮的类，而Demo是DIV的ID

<div id="demo" >00:00:00</div>

什么停止计数器是来自进度条的if，else语句：

 else{
    $("#demo").stopwatch().stopwatch('stop');           
    }

其他代码实际上更长，一旦条形图达到100，计数器就会停止，这意味着我使用if和else if语句将其余部分从0覆盖到99.

无论如何，如何编辑JS以获得具有最小，秒和毫秒的计数器？或者是否有任何其他jQuery插件有这样的计数器？

Answer 1

如果您查看了代码，就会找到defaultFormatMilliseconds（）函数，您可以修改它：

    return [pad2(hours), pad2(minutes), pad2(seconds), millis].join(':');
                                                     ^^^^^^^^---add milliseconds.

Answer 2

你真的不需要使用插件，它就像使用setInterval()制作你自己的计时器一样简单，这正是秒表插件所做的。

jsFiddle

<强> HTML

<div id="timer"><span class="value">0</span> ms</div>

<强> JS

setInterval(updateDisplay, 1); // every millisecond call updateDisplay

function updateDisplay() {
    var value = parseInt($('#timer').find('.value').text(), 10);
    value++;
    $('#timer').find('.value').text(value);
}

Answer 3

我尝试修改代码，以便我们可以看到计数精确到最后一毫秒，但这只会使秒表变慢（截至目前，我不知道减速是否是浏览器/系统硬件依赖）。

无论如何，这些代码将允许您指定最多100的更新间隔（从而为您提供精确到0.0秒的秒表，而不会减慢速度。）

编辑：我没有包含jinvtervals.js，因此秒表将使用默认格式化程序。

<强>使用Javascript：

function defaultFormatMilliseconds(x) {
    var millis, seconds, minutes, hours;
    millis = Math.floor((x % 1000) / 100);
    x /= 1000;
    seconds = Math.floor(x % 60);
    x /= 60;
    minutes = Math.floor(x % 60);
    x /= 60;
    hours = Math.floor(x % 24);
    // x /= 24;
    // days = Math.floor(x);
    return [pad2(hours), pad2(minutes), pad2(seconds)].join(':') + "." + millis;
}

<强> HTML

<script type="text/javascript">

    $(function () {
        $('#swhTimeExposed').stopwatch({
            updateInterval: 100
        });

        $('#btnSearch').button({
            icons: {
                primary: "ui-icon-clock"
            },
            text: true
        })
            .bind('click', function (e) {
                // Start Stop watch
                $('#swhTimeExposed').stopwatch('start');
            }
        );
    });
</script>

<span id="swhTimeExposed"> 00:00:00.0 </span>
<button type="submit" id="btnSearch" >Start</button>

jQuery秒表，毫秒

3 个答案: