如何使用jquery获取双击之间的时间差
How to get the time difference between double clicks using 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);
});
但它在两个控制台中显示的时间相同。有人能告诉我如何计算时差吗?
这里有一个简单的jQuery
函数,可以为每次x
点击返回所需格式的时差-演示
<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]
让我知道你的想法。这绝对不是一个完美的解决方案,但它可能会让你开始。
您可以使用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>
请注意,代码返回的差异时间以毫秒为单位
相关文章:
- 函数参数中的数据与指定变量之间的任何性能差异
- 全局变量和全局对象的属性之间有什么区别吗
- java.net和javascript之间正则表达式的差异
- JavaScript中的函数和对象之间没有区别吗?
- 获取@ResponseBody的一部分作为主干和Spring MVC控制器之间的参数
- Jquery在函数之间传递表行
- 根据某些条件在视图之间切换
- 在控制器和数据对象之间同步数据
- 用时间戳获取两个不同日期之间的时间差
- 如何在jQuery中获取两个事件之间的时间差
- angularjs计算开始时间和当前时间之间的时间差
- 获取用户和服务器时间之间的时间差
- 为什么 setimeout(function(), 0 ) 和 function() 之间有执行时间差
- 用HH:MM:SS javascript计算两个日期之间的时间差
- 如何使用jquery获取双击之间的时间差
- 如何减少客户端在socket.io中接收数据之间的时间差
- 在javascript中计算现在和未来时间之间的时间差
- 如何在moment.js中显示unix时间戳和当前日期之间的时间差
- 如何查看在Spring+JSP中发送请求和获取响应之间的时间差
- 用Javascript获取两个时间字符串之间的时间差