我有以下 Javascript 代码。如果在 div 内同时按下鼠标中键和鼠标右键，它们将移出浏览器，同时仍然按下两个按钮，然后释放其中一个按钮。这是公认的。但如果你释放另一个，这是不被识别的。是否有一种方法可以识别第二个鼠标按钮的释放，或者当鼠标移回浏览器窗口时能够找出哪些按钮处于向上/向下状态，以便可以更新状态。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
</head>
<body>
<div style="height:250px;background-color: pink"> </div>
<script type="text/javascript">
var doc = $(document);
var buttons = [ false, false, false ];
function mouseDown(e) {
buttons[e.which - 1] = true;
console.log(buttons);
e.preventDefault();
}
function mouseUp(e) {
buttons[e.which - 1] = false;
console.log(buttons);
e.preventDefault();
}
doc.on("mousedown", mouseDown);
doc.on("mouseup", mouseUp);
</script>
</body>
</html>
编辑
代码是here
编辑2
或者有人知道为什么这是不可能的以及任何表明这是不可能的引用文献。
最佳答案
您可以使用文档的 mouseenter 和事件的 buttons 属性来确定重新输入文档时哪个按钮按下了:
doc.on("mouseenter", function(e) {
console.log("mouseenter: " + e.target + " buttons: " + e.buttons);
//if (Object.prototype.toString.call(e.target) == '[object HTMLHtmlElement]') {
if (e.buttons == 1){
//left button
}
if (e.buttons == 2){
//right button
}
if (e.buttons == 4){
//middle
}
}
});
参见this link对于鼠标事件的 buttons 属性。
更新:
上面的链接:代表一个或多个按钮的数字。对于按下多个按钮的情况，这些值将被合并。 所以
if (e.buttons == 1){
//left button
}
else if (e.buttons == 2){
//right button
}
else if (e.buttons == 4){
//middle
}
else if (e.buttons == 3){
//left and right
}
else if (e.buttons == 6){
//middle and right
}
else if (e.buttons == 7){
//all 3
}
更新2:
第二次鼠标松开未注册的原因是在第一次鼠标松开后，浏览器停止监听 mousemove 事件。使用下面的这些处理程序尝试问题中的场景。鼠标移动将持续触发，直到您松开第一个按钮。一旦您释放第一个按钮，就不会再触发移动。我以为我可以在鼠标抬起时使用 setCapture 或 focus 来使窗口继续监视鼠标，但它不起作用。
window.addEventListener("mouseup", function( event ) {
console.log("window mouse up");
//window.focus();
//event.target.setCapture(true);
}, false);
window.addEventListener("mousemove", function( event ) {
console.log("window mouse move");
}, false);
关于javascript - 为什么这个 Javascript 无法识别鼠标抬起？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26627551/