如何避免jQuery UI可拖動也觸發點擊事件

Question

有一個可通過jQuery UI拖動拖動的大div（地圖）。該div有可點擊的子div。

我的問題是，如果你拖動地圖，在鼠標上，點擊事件會觸發你開始拖動的任何子div。

如果拖動它的一部分拖動（相對於某人只需單擊而沒有拖動，在這種情況下需要單擊事件），如何停止觸發單擊事件的鼠標。

Answer 1

你可能在開始拖動時設置一個變量，例如「justDragged = true」，然後在mouseUp事件中檢查這個變量，如果是true，將其設置爲false，然後執行event.preventDefault + return w/o做任何事情。這樣它就會在拖動之後跳過第一次點擊。似乎有點駭人聽聞，也許其他人會有一個更優雅的解決方案。

Answer 2

我有這個問題，解決的辦法是應用可點擊事件處理程序之前的可拖動事件處理程序。我正在移動一些代碼，並突然出現這個問題。我終於意識到我已經改變了我申請處理程序的順序。當我切換回來時，事情又開始正常工作 - 拖動不會導致點擊。

Answer 3

另一種方法是根本不允許內可拖動的可點擊區域拖動：

jQuery UI Draggable API

Answer 4

$('.selector').draggable({ 
    stop: function(event, ui) { 
     // event.toElement is the element that was responsible 
     // for triggering this event. The handle, in case of a draggable. 
     $(event.originalEvent.target).one('click', function(e){ e.stopImmediatePropagation(); }); 
    } 
}); 

這工作，因爲「一聽衆」被解僱以前「正常」聽衆。因此，如果一個聽衆停止傳播，它將永遠不會到達您之前設置的聽衆。