2015-11-07 56 views
4

我想要在单个按钮上点击两次之间的时差。 我有我类似这样的标记如何获得使用jquery的双击之间的时差?

<a href="#">click here</a> 

我使用此代码来获得两次点击之间的时间差。

var clickedTime = ''; 
var lastClicked = ''; 
$('body').on('click', 'a', function(e) { 
    var d = new Date(); 
    clickedTime = lastClicked; 
    lastClicked = d.getTime(); 
    console.log(clickedTime); 
    console.log(lastClicked); 
}); 

但它显示在这两个控制台同时。那么有人能告诉我如何获得时差吗?

+0

这个脚本似乎对我来说是正确的,它显示我的控制台(铬)不同的时间,只有差异是最后点击变量是更大的点击变量 –

+0

似乎无法重现您的错误。你能得到一个jsfiddle或者其他的东西吗? – Quannt

回答

1

您可以使用Date.prototype.getTime()获取单击事件的时间。

var click = 0; 
 
var time; 
 
var difference; 
 
$("a").click(function(){ 
 
    var date = new Date(); 
 
    click += 1; 
 
    if (click == 2) { 
 
     difference = date.getTime() - time; 
 
     click = 0; 
 
     console.log(difference); 
 
    } 
 
    else 
 
     time = date.getTime(); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> 
 
<a>Please double click on me!</a>

或者使用事件的Event.timeStamp财产。

var click = 0; 
 
var time; 
 
var difference; 
 
$("a").click(function(e){ 
 
    click += 1; 
 
    if (click == 2) { 
 
     difference = e.timeStamp - time; 
 
     click = 0; 
 
     console.log(difference); 
 
    } 
 
    else 
 
     time = e.timeStamp; 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script> 
 
<a>Please double click on me!</a>

注意,代码在milisecond返回diffrence时间。

1

下面是一个简单jQuery功能所需格式返回的时间差为每x点击 - Demo

<button>Get Time Difference</button> 

(function ($) { 
$.fn.clickTimer = function ($param, $numbClicks) { 
    function msTotime(ms) { 
     var mill = ms % 1000; 
     var seconds = Math.floor((ms/1000) % 60); 
     var minutes = Math.floor((ms/(60 * 1000)) % 60); 
     switch ($param) { 
      case "ms": 
       return ms; 
       break; 
      case "s": 
       return seconds; 
       break; 
      default: 
       return [minutes, seconds, mill]; 
     } 
    } 
    var counter = 0; 
    var Start_Time; 
    this.click(function (event) { 
     counter++; 
     if (counter == $numbClicks) { 
      counter = 0; 
      var now = event.timeStamp; 
      Diff = now - Start_Time; 
      console.log(msTotime(Diff)); 
     } else { 
      Start_Time = event.timeStamp; 
     } 
    }); 
    return this; 
}; 
})(jQuery); 

用法:

$(selector).clickTimer(time format , number of clicks); 

$("button").clickTimer("ms", 2); 
// returns time difference in milliseconds for every 2 clicks 

$("button").clickTimer("s", 2); 
// returns time difference in seconds 

$("button").clickTimer(false, 2); 
// returns an array [minutes, seconds, milliseconds] 

让我知道你在想什么。这绝对不是一个完美的解决方案,但它可能会让你开始。

相关问题