Как определено в jQuery это был обычный щелчок по тому же элементу или двойной щелчок?

Question

Как я могу определить в jQuery это был обычный щелчок по тому же элементу или двойной щелчок?

Например, у нас есть такой элемент:

<div id="here">Click me once or twice</div>

И нам нужно выполнять различные действия после обычного щелчка и двойного щелчка.

Я пробовал что-то вроде этого

$("#here").dblclick(function(){
    alert('Double click');
});
$("#here").click(function(){
    alert('Click');
});

Но, конечно, это не работает, каждый раз работает только "щелчок".

Затем некоторые люди показали мнеэто:

var clickCounter = new Array();
$('#here').click(function () {
clickCounter.push('true');
setTimeout('clickCounter.pop()', 50);
if (clickCounter.length > 2) {
    //double click
    clickCounter = new Array(); //drop array
} else {
    //click
    clickCounter = new Array(); //drop array    !bug ovethere
}
});

Здесь мы попытались установить интервал между щелчками, а затем отслеживать два последовательных события, но у этого есть одна проблема ... это тоже не работает.
Итак, кто-тознает как это сделать?или кто-то может поделиться ссылкой на материал, где я могу прочитать об этом?

Answer 1

С QuirksMode :

Dblclick

Событие dblclick используется редко. Даже когда вы используете его, вы должны быть уверены, что никогда не зарегистрируете оба обработчика события onclick и ondblclick для одного и того же элемента HTML.Узнать, что на самом деле сделал пользователь, почти невозможно, если вы зарегистрируете оба.

В конце концов, когда пользователь дважды щелкает элемент, событие одного щелчка происходит перед dblclick.Кроме того, в Netscape второе событие click также обрабатывается отдельно перед dblclick.Наконец, оповещения здесь тоже опасны.

Так что держите ваши клики и клики дважды разделенными, чтобы избежать осложнений.

(выделено мной)

Answer 2

То, что вы делаете в своем вопросе, это именно то, как это должно быть сделано.

$(".test").click(function() {
      $("body").append("you clicked me<br />");
});

$(".test").dblclick(function() {
      $("body").append("you doubleclicked me<br />");
});

Это работает, и вот для этого демо .

---

Так как, вы хотите обнаружить отдельный двойной щелчок.Для этого существует проект git .

$("button").single_double_click(function () {
  alert("Try double-clicking me!")
}, function () {
  alert("Double click detected, I'm hiding")
  $(this).hide()
})

Он добавляет события для обнаружения одиночных двойных щелчков.

Надеюсь, он вам сейчас поможет.