Question

我有一个Click事件处理程序和一个Paper.js项目的mousedrag事件处理程序。

item.on('click', function(event) {
  event.stopPropagation();
  event.preventDefault();
  //...  
});

item.on('mousedrag', function(event) {
  event.stopPropagation();
  event.preventDefault();
  //...  
});

每当我发生mousedrag事件时，也会生成click事件。我该如何防止这种情况？

Answer 1

单击鼠标后会释放一个单击事件。按住鼠标并拖动鼠标时，会生成拖动事件。除了'mousedrag'之外，我通常通过在'mousedown'和'mouseup'上设置事件来实现这一点。

在我周围发现，如果你从'mousedrag'事件处理程序返回false，它将抑制更多事件，即，不会调用'mouseup'或'click'。这是一张说明mouse events的草图。如果取消注释'mousedrag'处理程序中的return false，您将无法获得'mouseup'或'click'事件。

以下是我通常如何实现它的示例代码 - 我没有发现从处理程序返回false会阻止进一步处理直到今晚查看代码。

var drag;

view.on('mousedown', function(e) {
    drag = false;
});

view.on('mousedrag', function(e) {
    drag = true;
    // do whatever else you need to when dragging the mouse
});

view.on('mouseup', function(e) {
    // see if it was just a click and handle that
    if (drag) {
        // handle the end of a drag
    } else {
        // do whatever a click down/up without drag needs to do
    }

});

Paper.js区分点击和拖动事件

1 个答案: