javascript onmousedown - 向左还是向右？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/9355019/
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
onmousedown - left or right?
提问by ?mega
First of all, I am not looking for jquery solution, just simple pure javascript code, inside of an element.
首先，我不是在寻找 jquery 解决方案，只是在元素内部寻找简单的纯 javascript 代码。
Let's say we have following html code:
假设我们有以下 html 代码：
<select onmousedown=" ??? ">...</select>
<select onmousedown=" ??? ">...</select>
I want a simple script inside of the element to show popup message alert()with information which button was pushed down and what is a relative position of the element to the document <body>- something like offset()in jquery.
我想要元素内部的一个简单脚本来显示弹出消息alert()，其中包含按下哪个按钮的信息以及元素与文档的相对位置<body>- 类似于offset()jquery。
采纳答案by ShankarSangoli
Create a JavaScript function with some name and then call it on onmousedownevent passing the eventand thisobject which can be used inside the function.
创建一些名称的JavaScript函数，然后调用它onmousedown的事件经过event，并this可以在函数内部使用的对象。
HTML
HTML
<select onmousedown="onMouseDown(event, this)">...</select>
JS
JS
function onMouseDown(e, obj){
e = e || window.event; //window.event for IE
alert("Keycode of key pressed: " + (e.keyCode || e.which));
alert("Offset-X = " + obj.offsetLeft);
alert("Offset-Y = " + obj.offsetTop);
}
If you plan to use jQuery then you can use this script
如果你打算使用 jQuery 那么你可以使用这个脚本
$('select').mousedown(function(e){
alert("Keycode of key pressed: " + e.which);
//Inside the handler this points to the select DOM element
alert("Offset-X = " + $(this).offset().left);
alert("Offset-Y = " + $(this).offset().top);
});
Update:
更新：
If you want inline script then try this.
如果你想要内联脚本，那么试试这个。
<select onmousedown="function(e, obj){ e = e || window.event;alert('Keycode of key pressed: ' + (e.keyCode || e.which));alert('Offset-X = ' + obj.offsetLeft);alert('Offset-Y = ' + obj.offsetTop);}(event, this);">...</select>
回答by Guan Yuxin
MouseEvent.button has different values in different browsers
MouseEvent.button 在不同浏览器中具有不同的值
MouseEvent.button == 1// means left key in ie6~ie8
MouseEvent.button == 0// means left key in ie9&others
回答by Fraser
<select id="foo" onmousedown="mouseDown()">...</select>
<select id="foo" onmousedown="mouseDown()">...</select>
window.captureEvents(Event.MOUSEDOWN)
window.onmousedown = mouseDown
function mouseDown(e)
{
xPos = e.screenX;
yPos = e.screenY;
alert('onmousedown foo ' + ' x:' + xPos + ' y:'+ yPos);
}
Edit
编辑
<select id="foo" onmousedown="function mouseDown(e){alert(MouseEvent.button + ' x:' + e.screenX + ' y:'+ e.screenY);}">...</select>
<select id="foo" onmousedown="function mouseDown(e){alert(MouseEvent.button + ' x:' + e.screenX + ' y:'+ e.screenY);}">...</select>
回答by RobG
Edit
编辑
You might like to read this article before you go any further: Javascript Madness: Mouse Events
在继续之前，您可能想阅读这篇文章：Javascript Madness：鼠标事件
Clicks on a document dispatch a MouseEvent objectthat has lots of properties—e.g. MouseEvent.buttontells you which mouse button was pressed, MouseEvent.ctrlKeytells you if the control key was pressed when the click occured.
单击文档会调度一个具有许多属性的MouseEvent 对象—例如，MouseEvent.button告诉您按下了哪个鼠标按钮，MouseEvent.ctrlKey告诉您在发生单击时是否按下了控制键。
Note that the buttons aren't really "left" and "right", since they can be changed by user preferences, what you want to know is whether it was the primary button (usually left but might be right or could be something totally different from some other pointing device) or the secondary button (usually right but again, could be anything).
请注意，按钮并不是真正的“左”和“右”，因为它们可以根据用户偏好进行更改，您想知道它是否是主按钮（通常是左但可能是正确的，也可能是完全不同的东西）从其他指针设备）或辅助按钮（通常是正确的，但同样，可以是任何东西）。
Some play code:
一些播放代码：
<script>
function clickDetails(e) {
e = e || window.event;
var msg = [];
for (var p in e) {
msg.push(p + ': ' + e[p]);
}
document.getElementById('msg').innerHTML = msg.join('<br>');
}
window.onload = function() {
document.getElementById('sp0').onmousedown = clickDetails;
}
</script>
<div>
<span id="sp0">click me</span>
<br>
<span id="msg"></span>
</div>
Edit
编辑
Ah, what the hell:
啊，什么鬼：
<select onmousedown="alert('Button: ' + event.button
+ '\nPosition: ' + this.offsetLeft
+ ',' + this.offsetTop);">
