毫秒级的jQuery秒表

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

事情是，小时计数器是无用的，我宁愿有一个毫秒计数器显示出来。我使用这个js链接到一个按钮来启动它：

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

一件容易的按钮的类和演示作为ID为DIV

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

什么停止计数器一个如果，从一个进度条else语句：

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

对于其他的代码实际上是长和计数器停止一旦小节达到100，这意味着我掩盖了其余的从0到99与if和else if语句。

无论如何，JS如何被编辑为具有微秒，秒和毫秒的计数器？或者是否有任何其他jQuery插件有这样的计数器？

来源

2012-03-01 Marian

你真的不活动需要使用的插件，它是那样简单因为使用setInterval()来制作自己的计时器，这正是秒表插件的功能。

jsFiddle

HTML

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

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

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

来源

2012-03-01 17:15:01 Gabe

如果updateDisplay需要2毫秒执行会怎么样？那么这不会变得特别准确或有用。 *也许*这是插件试图解决的问题。 – 2012-03-01 17:19:16

看看秒表插件的来源，它做的是完全相同的事情。 – Gabe 2012-03-01 17:21:39

事情是，我仍然在学习JS和jQuery代码和命令，我不是那种我想学习的东西。我查看了插件源，发现它是这样做的，使用math.floor它计算秒数，分数等。我需要的是编辑源文件以显示毫秒。我试图使用上面的解决方案，并将其显示为毫秒乘以1000 – Marian 2012-03-01 17:36:48

如果你想通过代码看，你会发现defaultFormatMilliseconds（）函数，你可以修改：

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

来源

2012-03-01 17:13:09

是的它的广告毫秒，问题是现在，他们显示为毫秒* 1000 计数器御所为 1：1000 2：2000 3：3000 它计数millis不是1到1但是1000到1000 – Marian 2012-03-01 17:27:31

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

无论如何，这些代码将允许您指定一个更新间隔高达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>

来源

2015-02-18 12:31:37 Gelo32k

毫秒级的jQuery秒表

回答

相关问题