javascript - 如果 "mousemove"和 "click"事件同时触发该怎么办？

Question

我不知道这是否只是 Chrome 的问题(现在无法检查)，但是让我们尝试下面的代码，我们将两个事件绑定(bind)到某个元素:

$("div").on({
    mousemove: function(e) {
        console.log("move");
    },
    click: function(e) {
        console.log("click");
    }
});

如果我们尝试单击该元素，我们会发现由于某种原因 mousemove 事件在单击后立即触发，因此在控制台中我们有:

>> ...
>> click
>> move

演示: http://jsfiddle.net/gKqVt/

请注意，mousedown 和 mouseup 事件在同一场景下工作。

我在 SO 上看到了很多关于同一问题的问题，但没有一个(在我的搜索中)给出了如何触发 click 事件的简单想法仅 .

Answer 1

Mousemove 似乎与 Chrome 中的每个鼠标操作绑定(bind)，因此每次鼠标“移动”时都会存储鼠标位置，并对照之前的鼠标位置进行检查，以验证它确实已“移动”。

var currentPos=[];
$("div").on({
    mousemove: function(e) {
        if (e.pageX!==currentPos[0] && e.pageY !==currentPos[1]){
            currentPos=[e.pageX,e.pageY];
        this.innerHTML = "Event: " + e.type;
        console.log("move");
        }
    },
    click: function(e) {
        this.innerHTML = "Event: " + e.type;
        console.log("click");
    }
});

Demo | Source