如何避免可拖动的jQuery UI同时触发单击事件

Question

A有一个很大的div (地图)，可以通过jQuery UI draggable进行拖动。div具有可单击的子div。

我的问题是，如果你拖动地图，在鼠标上方，点击事件会在你开始拖动的任何子div上触发。

如果鼠标是拖动的一部分，我如何阻止鼠标触发单击事件(而不是有人只是在没有拖动的情况下单击，在这种情况下需要单击事件)。

Answer 1

$('.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(); } );
    }
});

这之所以有效，是因为“- listeners”在“普通”侦听器之前触发。因此，如果一个监听器停止传播，它将永远不会到达您先前设置的监听器。

Answer 2

我遇到了这个问题，解决方案是在单击事件处理程序之前应用draggable事件处理程序。我正在移动一些代码，突然遇到了这个问题。我终于意识到我已经改变了应用处理程序的顺序。当我把它切换回来的时候，一切又开始正常工作了--拖拽并没有导致点击。

Answer 3

您是否可以在开始拖动时设置一个变量，如"justDragged = true“，然后在mouseUp事件上检查此变量，如果为true，则将其设置为false，然后执行event.preventDefault + return w/o。这样，它就会跳过拖动后的第一次单击。看起来有点老土，也许其他人会有一个更优雅的解决方案。