JavaScript:检查鼠标按钮是否按下？

Question

有没有办法检测 JavaScript 中的鼠标按钮当前是否按下？

我知道“mousedown”事件，但这不是我需要的。按下鼠标按钮后的某个时间，我希望能够检测它是否仍被按下。

这可能吗？

Answer 1

关于 Pax' solution :如果用户有意或无意地点击了多个按钮，它就不起作用。别问我怎么知道的:-(。

正确的代码应该是这样的:

var mouseDown = 0;
document.body.onmousedown = function() { 
  ++mouseDown;
}
document.body.onmouseup = function() {
  --mouseDown;
}

通过这样的测试:

if(mouseDown){
  // crikey! isn't she a beauty?
}

如果您想知道按下了什么按钮，请准备好让 mouseDown 成为一个计数器数组，并为单独的按钮分别计算它们:

// let's pretend that a mouse doesn't have more than 9 buttons
var mouseDown = [0, 0, 0, 0, 0, 0, 0, 0, 0],
    mouseDownCount = 0;
document.body.onmousedown = function(evt) { 
  ++mouseDown[evt.button];
  ++mouseDownCount;
}
document.body.onmouseup = function(evt) {
  --mouseDown[evt.button];
  --mouseDownCount;
}

现在您可以检查到底按下了哪些按钮:

if(mouseDownCount){
  // alright, let's lift the little bugger up!
  for(var i = 0; i < mouseDown.length; ++i){
    if(mouseDown[i]){
      // we found it right there!
    }
  }
}

请注意，上面的代码仅适用于向您传递从 0 开始的按钮编号的符合标准的浏览器。 IE 使用当前按下按钮的位掩码:

• 0 代表“没有按下任何东西”
• 左边1个
• 右边2个
• 中间4个
• 以及以上的任意组合，例如，5 代表左 + 中

因此请相应地调整您的代码!我把它留作练习。

请记住:IE 使用一个名为……“事件”的全局事件对象。

顺便说一句，IE 有一个对您的情况很有用的功能:当其他浏览器仅针对鼠标按钮事件(onclick、onmousedown 和 onmouseup)发送“按钮”时，IE 也会使用 onmousemove 发送它。因此，您可以在需要了解按钮状态时开始监听 onmousemove，并在获得 evt.button 后立即检查它——现在您知道按下了哪些鼠标按钮:

// for IE only!
document.body.onmousemove = function(){
  if(event.button){
    // aha! we caught a feisty little sheila!
  }
};

当然，如果她装死不动，你什么也得不到。

相关链接:

• MouseEvent's button (DOM 2)
• MSDN's button

更新#1:我不知道为什么我保留了 document.body 风格的代码。将事件处理程序直接附加到文档会更好。