JavaScript:检查鼠标按钮是否按下? [英] JavaScript: Check if mouse button down?

查看:161
本文介绍了JavaScript:检查鼠标按钮是否按下?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

Is there a way to detect if a mouse button is currently down in JavaScript?

我知道mousedown事件,但这不是我需要的。按下鼠标按钮一段时间后,我希望能够检测到它是否仍然按下。

I know about the "mousedown" event, but that's not what I need. Some time AFTER the mouse button is pressed, I want to be able to detect if it is still pressed down.

这可能吗?

推荐答案

关于Pax'解决方案:如果用户有意或无意地点击了多个按钮,它就不起作用。不要问我怎么知道: - (。

Regarding Pax' solution: it doesn't work if user clicks more than one button intentionally or accidentally. Don't ask me how I know :-(.

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

The correct code should be like that:

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

通过测试像这样:

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

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

If you want to know what button is pressed, be prepared to make mouseDown an array of counters and count them separately for separate buttons:

// 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;
}

现在你可以检查一下按下了什么按钮:

Now you can check what buttons were pressed exactly:

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使用当前按下按钮的位掩码:

Now be warned that the code above would work only for standard-compliant browsers that pass you a button number starting from 0 and up. IE uses a bit mask of currently pressed buttons:


  • 0表示没有按下

  • 1表示左侧

  • 2表示正确

  • 4表示中间

  • 以及上述任意组合,例如: 5为左+中

  • 0 for "nothing is pressed"
  • 1 for left
  • 2 for right
  • 4 for middle
  • and any combination of above, e.g., 5 for left + middle

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

So adjust your code accordingly! I leave it as an exercise.

并记住:IE使用名为&hellip的全局事件对象; 事件。

顺便说一句,IE有一个对你的情况有用的功能:当其他浏览器只为鼠标按钮事件发送按钮时(onclick,onmousedown,和onmouseup),IE也发送它与onmousemove。因此,当你需要知道按钮状态时,你可以开始听onmousemove,并在你得到它时立即检查evt.button—现在您知道按下了哪些鼠标按钮:

Incidentally IE has a feature useful in your case: when other browsers send "button" only for mouse button events (onclick, onmousedown, and onmouseup), IE sends it with onmousemove too. So you can start listening for onmousemove when you need to know the button state, and check for evt.button as soon as you got it — now you know what mouse buttons were pressed:

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

当然,如果她玩死了而不动,你什么也得不到。

Of course you get nothing if she plays dead and not moving.

相关链接:

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

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

Update #1: I don't know why I carried over the document.body-style of code. It will be better to attach event handlers directly to the document.

这篇关于JavaScript:检查鼠标按钮是否按下?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆