javascript 如何检测鼠标中键单击？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21224327/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to detect middle mouse button click?
提问by Nate
All of the questions I've seen on how to detect a middle mouse click in JavaScript are related to jQuery, but I'm wondering how I can detect middle mouse button clicks with regular JavaScript. I tried using onClick(), but it only appears to work for the left mouse button.
我所看到的关于如何在 JavaScript 中检测鼠标中键的所有问题都与 jQuery 相关，但我想知道如何使用常规 JavaScript 检测鼠标中键单击。我尝试使用onClick()，但它似乎只适用于鼠标左键。
Is there a JavaScript function that can detect both left and middle mouse button clicks or, if not, that can detect middle mouse button clicks?
是否有可以检测鼠标左键和中键单击的 JavaScript 函数，或者如果没有，可以检测鼠标中键单击？
The reason I ask is that I want to make a function call when links are clicked, irregardless of whether the left or middle mouse button was used.
我问的原因是我想在单击链接时进行函数调用，而不管使用的是鼠标左键还是鼠标中键。
回答by Schien
onclick is not tied to a mouse, but more on the target element itself.
onclick 与鼠标无关，而是更多地与目标元素本身有关。
Here's how to detect whether an element is middle clicked:
以下是如何检测元素是否被中键单击：
document.body.onclick = function (e) {
if (e && (e.which == 2 || e.button == 4 )) {
console.log('middleclicked')
}
}
回答by Sterling Archer
You'll have to detect the event 2
您必须检测该事件 2
event = event || window.event; //make sure to pass the event into the function
if (event.which == 2) {
//do code..
}
回答by Abner Chou
The code below could help you. It can detect which mouse button the user clicked. e.which == 2is for the middle button.
下面的代码可以帮助你。它可以检测用户单击了哪个鼠标按钮。e.which == 2用于中间按钮。
<script type="text/javascript">
function detect_button(e){
e = e || window.event;
if (e.which == null){
button = (e.button < 2) ? 'left' : ((e.button == 4) ? 'middle' : 'right');
}
else{
button = (e.which < 2) ? 'left' : ((e.which == 2) ? 'middle' : 'right');
}
alert(button);
}
</script>
回答by disrvptor
You have to use stuff that's already built into the DOM and Javascript engines and then put in cases where browsers differ (this is why jQuery is normally used).
你必须使用已经内置到 DOM 和 Javascript 引擎中的东西，然后在浏览器不同的情况下使用（这就是通常使用 jQuery 的原因）。
document.getElementById("myBtn").onclick = function(event) {
event = event || window.event
// Now event is the event object in all browsers.
// Note: event.target - the reference to clicked element. IE uses event.srcElement
// In W3C there is a button property which works same in all browsers except IE:
// 0 - left button, 1 - middle button, 2 - right button
// For IE, left button = button & 1 (the 1st bit) is set to 1
// right button = button & 2 (the 2nd bit) is 1
// and middle button = button & 4 (the 3rd bit)
var left = event.button == 0 || 1 == event.button&1;
var middle = event.button == 1 || 1 == event.button&2;
var right = event.button == 2 || 1 == event.button&3;
// Put your code here
}
