Answers:
正如其他人提到的那样,可以通过常规鼠标事件(mousedown,mouseup,click)来检测鼠标右键。但是,如果您在弹出右键菜单时正在寻找触发事件,那么您所寻找的位置是错误的。也可以通过键盘(在Windows和某些Linux上为Shift + F10或上下文菜单键)访问右键单击/上下文菜单。在这种情况下,您要查找的事件是oncontextmenu
:
window.oncontextmenu = function ()
{
showCustomMenu();
return false; // cancel default menu
}
至于鼠标事件本身,浏览器将事件属性设置为事件对象,可以从事件处理功能访问该属性:
document.body.onclick = function (e) {
var isRightMB;
e = e || window.event;
if ("which" in e) // Gecko (Firefox), WebKit (Safari/Chrome) & Opera
isRightMB = e.which == 3;
else if ("button" in e) // IE, Opera
isRightMB = e.button == 2;
alert("Right mouse button " + (isRightMB ? "" : " was not") + "clicked!");
}
(isRightMB?"was not" : "")
应该是(isRightMB?"was" : "was not")
。对 ?请帮助进行审查。
onmousedown
和onmouseup
,但不会触发onclick
。显然,在Chrome中,onclick
仅是鼠标左键触发的。(是的,我对此进行了多次测试)要检测鼠标右键,您必须组合onmousedown
和onmouseup
,或使用oncontextmenu
。
您可以使用event window.oncontextmenu
,例如:
window.oncontextmenu = function () { e.preventDefault() }
没用。
是的,尽管w3c表示可以通过click事件检测到右键单击,但是在通常的浏览器中,onClick不会通过右键单击来触发。
实际上,右键单击仅触发onMouseDown,onMouseUp和onContextMenu。
因此,您可以将“ onContextMenu”视为右键单击事件。这是HTML5.0标准。
如果要检测鼠标右键,则不应使用MouseEvent.which
属性,因为它是非标准的,并且浏览器之间存在很大的不兼容性。(请参阅MDN)您应该改为使用MouseEvent.button
。它返回一个代表给定按钮的数字:
0
:按下主按钮,通常是向左按钮或未初始化状态1
:按下辅助按钮,通常是滚轮按钮或中间按钮(如果有)2
:按下辅助按钮,通常是右键3
:第四个按钮,通常是“浏览器后退”按钮4
:第五个按钮,通常是“浏览器前进”按钮MouseEvent.button
除了标准鼠标外,还可以处理更多输入类型:
按钮的配置可能与标准的“从左到右”布局不同。配置为左手使用的鼠标可能会使按钮的操作反向。一些指点设备仅具有一个按钮,并使用键盘或其他输入机制指示主要,辅助,辅助等。其他一些指示设备可能具有许多映射到不同功能和按钮值的按钮。
参考:
否,但是您可以检测“ onmousedown”事件中使用了什么鼠标按钮...,然后确定是否是“右键单击”。
onmousedown
,onmouseup
和onclick
。但是,如果您要覆盖右键单击菜单,则这些事件不是您应该使用的事件(请参见下面的答案)。
以下代码使用jQuery rightclick
根据默认mousedown
和mouseup
事件生成自定义事件。它考虑了以下几点:
contextmenu
未在此处触发事件)on('contextmenu', ...)
do$(function ()
{ // global rightclick handler - trigger custom event "rightclick"
var mouseDownElements = [];
$(document).on('mousedown', '*', function(event)
{
if (event.which == 3)
{
mouseDownElements.push(this);
}
});
$(document).on('mouseup', '*', function(event)
{
if (event.which == 3 && mouseDownElements.indexOf(this) >= 0)
{
$(this).trigger('rightclick');
}
});
$(document).on('mouseup', function()
{
mouseDownElements.length = 0;
});
// disable contextmenu
$(document).on('contextmenu', function(event)
{
event.preventDefault();
});
});
// Usage:
$('#testButton').on('rightclick', function(event)
{
alert('this was a rightclick');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="testButton">Rightclick me</button>
是的!
function doSomething(e) {
var rightclick;
if (!e) var e = window.event;
if (e.which) rightclick = (e.which == 3);
else if (e.button) rightclick = (e.button == 2);
alert('Rightclick: ' + rightclick); // true or false
}
elem.addEventListener("click", doSomething)
完成右键单击的最简单方法是使用
$('classx').on('contextmenu', function (event) {
});
但是,这不是跨浏览器解决方案,浏览器在此事件上的行为有所不同,尤其是firefox和IE。我将在下面为跨浏览器解决方案推荐
$('classx').on('mousedown', function (event) {
var keycode = ( event.keyCode ? event.keyCode : event.which );
if (keycode === 3) {
//your right click code goes here
}
});
这是触发它的最简单方法,它适用于除(CefSharp Chromium等...)应用程序Web视图之外的所有浏览器。希望我的代码对您有帮助,祝您好运!
const contentToRightClick=document.querySelector("div#contentToRightClick");
//const contentToRightClick=window; //If you want to add it into the whole document
contentToRightClick.oncontextmenu=function(e){
e=(e||window.event);
e.preventDefault();
console.log(e);
return false; //Remove it if you want to keep the default contextmenu
}
div#contentToRightClick{
background-color: #eee;
border: 1px solid rgba(0,0,0,.2);
overflow: hidden;
padding: 20px;
height: 150px;
}
<div id="contentToRightClick">Right click on the box !</div>
这是和我一起工作
if (evt.xa.which == 3)
{
alert("Right mouse clicked");
}
尝试使用which
and / or button
属性
该演示
function onClick(e) {
if (e.which === 1 || e.button === 0) {
console.log('Left mouse button at ' + e.clientX + 'x' + e.clientY);
}
if (e.which === 2 || e.button === 1) {
console.log('Middle mouse button ' + e.clientX + 'x' + e.clientY);
}
if (e.which === 3 || e.button === 2) {
console.log('Right mouse button ' + e.clientX + 'x' + e.clientY);
}
if (e.which === 4 || e.button === 3) {
console.log('Backward mouse button ' + e.clientX + 'x' + e.clientY);
}
if (e.which === 5 || e.button === 4) {
console.log('Forward mouse button ' + e.clientX + 'x' + e.clientY);
}
}
window.addEventListener("mousedown", onClick);
一些信息在这里
要使用鼠标右键单击,可以使用“ oncontextmenu”事件。下面是一个示例:
document.body.oncontextmenu=function(event) {
alert(" Right click! ");
};
上面的代码在按下右键时会提示一些文本。如果您不希望显示浏览器的默认菜单,则可以添加return false;。在功能内容的末尾。谢谢。