javascript - 如何区分单击事件和双击事件？

Question

我在 li 中有一个 id 为 "my_id" 的按钮。我用这个元素附加了两个 jQuery 事件

1.

$("#my_id").click(function() { 
    alert('single click');
});

2.

$("#my_id").dblclick(function() {
    alert('double click');
});

但每次它都会给我单击

Answer 1

不是使用更多的临时状态和 setTimeout，而是有一个名为 detail 的本地属性，您可以从 event 对象访问它!

element.onclick = event => {
   if (event.detail === 1) {
     // it was a single click
   } else if (event.detail === 2) {
     // it was a double click
   }
};

现代浏览器甚至 IE-9 都支持它:)

来源:https://developer.mozilla.org/en-US/docs/Web/API/UIEvent/detail