jquery - jQuery秒表，毫秒和空格键作为触发器

Question

我刚刚开始“学习”jQuery，所以我几乎一无所知。但是，我想要一个秒表，显示分钟、秒和毫秒。我想通过按空格键启动计时器，并通过再次按空格键停止计时器。有谁知道如何做到这一点？请记住，我对 jQuery 还很陌生，所以一个好的描述会很棒。

谢谢！

Answer 1

一种方法是使用new Date().getTime() 和在间隔内比较我们存储的初始时间与当前时间来检索当前时间：

currentTime - startTime = difference in MS

现在有了 MS 的差异，我们可以轻松地做一些基本的数学运算：

LIVE DEMO

var int, ms=0, s=0, m=0;

function swatch(){

  var startTime = new Date().getTime();
  int = setInterval(function(){
      var time = new Date().getTime(); 
      var dif = time-startTime;
      ms= dif%1000;
      s = Math.floor(dif/1000)%60;
      m = Math.floor(dif/1000/60)%60;
      $('#swatch').text( m+':'+s+':'+ms); 
  },1);

}


$(document).on('keydown', function( e ){
   if(e.keyCode == 32 && !int){
        swatch();
   }else{
     clearInterval(int);
     int=0;
   }
});

OR THIS WAY (Read Rick's comments below)用于前导“0”

  s = ('0'+ Math.floor(dif/1000)%60 ).slice(-2);
  m = ('0'+ Math.floor(dif/1000/60)%60 ).slice(-2);

Answer 2

JQuery秒表示例可以在这里找到：http ://www.jquery4u.com/jquery-date-and-time-2/online-jquery-stopwatch/

对于您使用空格键的开始/停止，请使用：

$('body').keyup(function(e){
   if(e.keyCode == 32){
       // user has pressed space
       ss();
   }
});