Question

我在如何检测JavaScript中鼠标点击方面遇到的所有问题都与jQuery有关，但我想知道如何使用常规JavaScript检测鼠标中键点击。我尝试使用onClick()，但它似乎只适用于鼠标左键。

是否有一个JavaScript函数可以检测鼠标左键和中键点击，如果没有，可以检测到鼠标中键点击？

我问的原因是我想在点击链接时进行函数调用，无论是使用鼠标左键还是鼠标中键。

Answer 1

onclick不依赖于鼠标，而是更多地依赖于目标元素本身。

以下是检测元素是否被中间点击的方法：

document.body.onclick = function (e) {
  if (e && (e.which == 2 || e.button == 4 )) {
    console.log('middleclicked')
  }
}

Answer 2

您必须检测事件2

event = event || window.event; //make sure to pass the event into the function
if (event.which == 2) {
    //do code..
}

Answer 3

以下代码可以帮助您。它可以检测用户点击的鼠标按钮。 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>

Answer 4

这里已有的答案/解决方案可能对其他人有效，但对我无效。所以我的解决方案是：我不使用 click 事件，而是使用 mousedown 事件

window.onmousedown = (event) => {
    if (event.button == 1 || event.buttons == 4) {
        console.log('middle mouse');
    }
}

或

window.addEventListener('mousedown', (event) => {
   if (event.button == 1 || event.buttons == 4) {
      console.log('middle mouse');
   }
});

Answer 5

你必须使用已经内置在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
}

如何检测鼠标中键点击？

5 个答案: