我所见过的关于如何在JavaScript中检测鼠标中点击的问题都与jQuery有关,但我想知道如何使用普通JavaScript检测鼠标中键的点击。我尝试使用onClick()
,但它似乎只适用于鼠标左键。如何检测鼠标中键点击?
是否有JavaScript函数可以检测到鼠标左键和鼠标中键的点击,如果没有,可以检测鼠标中键的点击?
我问的原因是我想在单击链接时进行函数调用,而不管是否使用了鼠标左键或鼠标中键。
我所见过的关于如何在JavaScript中检测鼠标中点击的问题都与jQuery有关,但我想知道如何使用普通JavaScript检测鼠标中键的点击。我尝试使用onClick()
,但它似乎只适用于鼠标左键。如何检测鼠标中键点击?
是否有JavaScript函数可以检测到鼠标左键和鼠标中键的点击,如果没有,可以检测鼠标中键的点击?
我问的原因是我想在单击链接时进行函数调用,而不管是否使用了鼠标左键或鼠标中键。
onclick不绑定到鼠标,而是绑定到目标元素本身。
下面是如何检测的元素是否是中间点击:
document.body.onclick = function (e) {
if (e && (e.which == 2 || e.button == 4)) {
console.log('middleclicked')
}
}
我已经添加了另一个示例,您可以传入其他参数。注意函数本身是如何返回一个函数的,隐含的“e”位于封装函数的调用堆栈上。我通常不会遇到上下文来解释这种语法。感谢您的机会,尤其是不使用jQuery! – Schien
@fiatjaf感谢您编辑答案。只是想指出编辑将onclick事件附加到document.body,而我的答案附加到特定的dom节点。编辑会显着改变我的答案。由于OP已经得到了他的答案,所以我不介意在这一点上是否恢复编辑。 – Schien
对于大编辑,我很抱歉,但StackOverflow并不是一个注定只回答提问的特定人员的网站,而是一个关于如何编写代码的大百科全书。我认为,你的答案在其他地方不容易找到有用的信息,但它令人困惑。我的编辑是为了让未来的人们阅读这个问题更有用,更容易阅读。如果您认为有问题,请重新编辑。 – fiatjaf
你必须检测事件2
event = event || window.event; //make sure to pass the event into the function
if (event.which == 2) {
//do code..
}
下面的代码可以帮助你。它可以检测用户点击了哪个鼠标按钮。 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>
如果您要复制从评论链接的代码,请至少先解释它。 –
你必须使用已经内置到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
}
后前搜索:http://stackoverflow.com/questions/5833928/jquery-alert-when-middle-mouse-button-clicked )。 对不起,内特,我还没有好好收获! –
http://www.thonky.com/javascript-and-css-guide/detect-mouse-button/ – sinisake
@ Gaucho_9在谴责之前阅读问题;-)我试图弄清楚是否有可能跟踪中老鼠按钮点击*没有* jQuery。 – Nate