jQuery:在mousemove事件期间检测按下的鼠标按钮 [英] jQuery: Detecting pressed mouse button during mousemove event
问题描述
我试图检测在jQuery下的mousemove事件中用户按下了哪个鼠标按钮-如果有的话，但是我得到的结果是模棱两可的:
I tried to detect which mouse button -if any- is the user pressing during a mousemove event under jQuery, but I'm getting ambiguous results:
no button pressed: e.which = 1 e.button = 0
left button pressed: e.which = 1 e.button = 0
middle button pressed: e.which = 2 e.button = 1
right button pressed: e.which = 3 e.button = 2
代码:
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
<body>
<input id="whichkey" value="type something">
<div id="log"></div>
<script>$('#whichkey').bind('mousemove',function(e){
$('#log').html(e.which + ' : ' + e.button );
}); </script>
</body>
</html>
我怎么知道按下鼠标左键和根本没有按钮之间的区别?
How can I tell the difference between left mouse button pressed and no button at all?
推荐答案
您可以编写一些代码来跟踪鼠标左键的状态，并通过一个小功能可以对以下事件变量进行预处理: mousemove事件.
You can write a bit of code to keep track of the state of the left mouse button, and with a little function you can pre-process the event variable in the mousemove event.
要跟踪LMB的状态，请将事件绑定到mousedown和mouseup的文档级别，然后检查e.which以设置或清除该标志.
To keep track of the state of the LMB, bind an event to document level for mousedown and mouseup and check for e.which to set or clear the flag.
我的代码中的tweakMouseMoveEvent()函数完成了预处理.要支持IE版本< 9，您必须检查是否在窗口外部释放了鼠标按钮，如果是，则清除该标志.然后，您可以更改传递的事件变量.如果e.which最初是1(没有按钮或LMB)，并且没有按下左按钮的当前状态，则只需将e.which设置为0，然后在mousemove事件的其余部分中使用它来检查没有按下按钮.
The pre-processing is done by the tweakMouseMoveEvent() function in my code. To support IE versions < 9, you have to check if mouse buttons were released outside the window and clear the flag if so. Then you can change the passed event variable. If e.which was originally 1 (no button or LMB) and the current state of the left button is not pressed, just set e.which to 0, and use that in the rest of your mousemove event to check for no buttons pressed.
在我的示例中，mousemove处理程序仅调用将当前事件变量传递通过的tweak函数，然后输出e.which的值.
The mousemove handler in my example just calls the tweak function passing the current event variable through, then outputs the value of e.which.
$(function() {
var leftButtonDown = false;
$(document).mousedown(function(e){
// Left mouse button was pressed, set flag
if(e.which === 1) leftButtonDown = true;
});
$(document).mouseup(function(e){
// Left mouse button was released, clear flag
if(e.which === 1) leftButtonDown = false;
});
function tweakMouseMoveEvent(e){
// Check from jQuery UI for IE versions < 9
if ($.browser.msie && !e.button && !(document.documentMode >= 9)) {
leftButtonDown = false;
}
// If left button is not set, set which to 0
// This indicates no buttons pressed
if(e.which === 1 && !leftButtonDown) e.which = 0;
}
$(document).mousemove(function(e) {
// Call the tweak function to check for LMB and set correct e.which
tweakMouseMoveEvent(e);
$('body').text('which: ' + e.which);
});
});
在此处尝试现场演示: http://jsfiddle.net/G5Xr2/
Try a live demo here: http://jsfiddle.net/G5Xr2/
这篇关于jQuery:在mousemove事件期间检测按下的鼠标按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
