关于’双击’事件的jQuery（dblclick for mobile）

我有以下jquery事件处理函数：

$('.target').on('dblclick', function() { //respond to double click event }); 

我的问题是这个事件处理程序不适用于触控设备（iPhone，iPad ……）。 任何人都可以推荐一种可靠的替代dblclick ，可以在触摸设备上使用，并且仍然可以在全尺寸设备上轻松双击使用吗？

Answer 1

我最终构建了一个可在移动设备和桌面设备上运行的自定义双击function：

 var touchtime = 0; $(".target").on("click", function() { if (touchtime == 0) { // set first click touchtime = new Date().getTime(); } else { // compare first click to this click and see if they occurred within double click threshold if (((new Date().getTime()) - touchtime) < 800) { // double click occurred alert("double clicked"); touchtime = 0; } else { // not a double click so set as a new first click touchtime = new Date().getTime(); } } }); 

  
Double click me 

Answer 2

您可以在元素上绑定多个事件侦听器，并为触摸设备使用jQuery的tap事件。

 $( ".target" ).on({ dbclick: function() { //do stuff }, touch: function() { //do the same stuff } }); 

Answer 3

@JRulle的标记答案似乎只适用于单个对象，如果你有许多具有相同类的实例，它们将被视为单个对象，请参阅示例
小提琴的例子

我的解决方案似乎适用于这样的情况

 var touchtime = 0; $('.target').on('click', function() { if (touchtime == 0) { touchtime = new Date().getTime(); } else { if (((new Date().getTime()) - touchtime) < 800) { alert("double clicked"); touchtime = 0; } else { touchtime = 0; } } }); 

  
click me!
 
then click me!
 click link 

Answer 4

将其添加到index.html

我发现移动缩放function会抛弃Jquery的dblclick。 基本上它说你的视口不会有效地改变关闭缩放。 这适用于运行Chrome的Nexus 5。

Answer 5

我对上面的代码进行了改进，单击后没有检测到双击：

 var touchtime = 0; $(".target").on("click", function() { if (((new Date().getTime()) - touchtime) < 500) { alert("double clicked"); } touchtime = new Date().getTime(); }); 

此代码检测所有双击。 我还将触摸时间减少到500毫秒（标准双击时间）。

Answer 6

您需要在函数末尾输入“return false”，如下所示

 var touchtime = 0; $('.dbclickopen').click(function() { if(touchtime == 0) { //set first click touchtime = new Date().getTime(); } else { //compare first click to this click and see if they occurred within double click threshold if(((new Date().getTime())-touchtime) < 800) { //double click occurred touchtime = 0; window.location = this.href; } else { //not a double click so set as a new first click touchtime = new Date().getTime(); } } return false; });