如何区分点击和拖放事件？

Question

我有一个问题,元素既可拖动也有点击事件.

$('.drag').mousedown(function() {
    //...
});

$('.class').click(function() {
    //...
)};

<div class="drag class"></div>

当我拖放元素时,click事件也会被触发.怎么预防？

Answer 1

您也可以使用mousemove和mousedown事件一起执行某些操作来禁用click事件:

var dragging = 0;

$('.drag').mousedown(function() {
    $(document).mousemove(function(){
       dragging = 1;
    });
});

$(document).mouseup(function(){
    dragging = 0;
    $(document).unbind('mousemove');
});

$('.class').click(function() {
    if (dragging == 0){
       // default behaviour goes here
    }
    else return false;
)};

Answer 2

你应该能够通过停止mousedown事件的传播来做到这一点.

$('.drag').mousedown(function(event){
  event.stopPropagation();
});  

您可能必须确保在单击事件之前附加了此事件.