无法检测在移动鼠标时按下的鼠标按钮

Can not detect mouse buttons pressed onmousemove?

本文关键字：鼠标 按钮 检测 移动      更新时间：2023-09-26

录制要在onmousemove中使用的onmousedown和onmouseup不起作用，因为如果在窗口外释放按钮，onmouseup只会触发一次：http://jsfiddle.net/f1nqproy/5/

event.button仅在Internet Explorer中返回有意义的结果。

event.buttons仅存在于Firefox中。

那么其他浏览器该怎么办呢？

编辑：
MouseEvent.buttons现在已经标准化了，所以这个问题已经解决了：https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons

如果你想做一些与浏览器无关的事情，最简单的方法是使用jQuery

jQuery是一个快速、小型且功能丰富的JavaScript库。它使诸如HTML文档遍历和操作、事件处理等，使用一个易于使用的API，动画和Ajax更加简单跨多种浏览器。具有多功能性和扩展性，jQuery已经改变了数百万人编写JavaScript。

您可以轻松地绑定到mouseup、mousedown事件，而忘记浏览器兼容性

$( window).mouseup(function(e){
    console.log("mouseup:", e.button);
});
$( window).mousedown(function(e){    
    console.log("mousedown:", e.button);
});

-----更新------

IE（像往常一样）做另一项工作，这样如果指针在窗口外，就不会得到mouseup事件。

黑客攻击是使用mouseleave事件：

//hack for IE
$( window).mouseleave (function(e){    
    console.log("mouseleave");
});

Js出价

可能是，问题是浏览器同时触发事件onmouseup。每次检查鼠标光标在元素上时是否触发了事件，事件绑定到该元素。因此，在您的案例中，第一个事件触发（不知道为什么），而第二个事件不起作用——这是正确的行为——而是触发了mouseleave事件。

试图抓住鼠标离开：

var buttonDown = [false, false, false];
$( window).on('mouseup mouseleave', function(e){
    buttonDown[e.button] = true;
    console.log("Buttons up:", buttonDown);
    buttonDown = [false, false, false];
});
$( window).on('mousedown', function(e){
    buttonDown[e.button] = true;
    console.log("Buttons down:", buttonDown);
    buttonDown = [false, false, false];
});
相关文章：