如何区分鼠标“点击”和“拖动” [英] How to distinguish mouse "click" and "drag"

问题描述

我使用 jQuery.click 来处理Raphael图上的鼠标点击事件，同时，我需要处理鼠标拖动事件，鼠标拖动包含 mousedown ， mouseup 和 mousemove

I use jQuery.click to handle the mouse click event on Raphael graph, meanwhile, I need to handle mouse drag event, mouse drag consists of mousedown, mouseupand mousemove in Raphael.

很难区分点击和拖因为点击还包含 mousedown & mouseup ，如何区分鼠标点击和&鼠标拖然后在Javascript？

It is difficult to distinguish click and drag because click also contain mousedown & mouseup, How can I distinguish mouse "click" & mouse "drag" then in Javascript?

推荐答案

我认为不同的是有一个 mousemove 在拖动中 mousedown 和 mouseup 之间，但不是点击。

I think the difference is that there is a mousemove between mousedown and mouseup in a drag, but not in a click.

您可以这样做：

var flag = 0;
var element = xxxx;
element.addEventListener("mousedown", function(){
    flag = 0;
}, false);
element.addEventListener("mousemove", function(){
    flag = 1;
}, false);
element.addEventListener("mouseup", function(){
    if(flag === 0){
        console.log("click");
    }
    else if(flag === 1){
        console.log("drag");
    }
}, false);

这篇关于如何区分鼠标“点击”和“拖动”的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！