是否右键单击Javascript事件？

Question

是否右键单击Javascript事件？如果是这样,我该如何使用它？

Answer 1

正如其他人所提到的,可以通过常用的鼠标事件(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!");
} 

window.oncontextmenu - MDC

Answer 2

看看下面的jQuery代码:

$("#myId").mousedown(function(ev){
      if(ev.which == 3)
      {
            alert("Right mouse button clicked on element with id myId");
      }
});

价值which将是:

• 1表示左键
• 2为中间按钮
• 3为右键

Answer 3

您可能想尝试以下属性：

\n

\n
1. 按钮- ( caniuse );
\n
2. 其中- ( caniuse )（已弃用）。
\n

\n\n

\r\n

\r\n

function onMouseDown(e)\n{\n    if (e.which === 1 || e.button === 0)\n    {\n        console.log(\'"Left" at \' + e.clientX + \'x\' + e.clientY);\n    }\n\n    if (e.which === 2 || e.button === 1)\n    {\n        console.log(\'"Middle" at \' + e.clientX + \'x\' + e.clientY);\n    }\n\n    if (e.which === 3 || e.button === 2)\n    {\n        console.log(\'"Right" at \' + e.clientX + \'x\' + e.clientY);\n    }\n\n    if (e.which === 4 || e.button === 3)\n    {\n        console.log(\'"Back" at \' + e.clientX + \'x\' + e.clientY);\n    }\n\n    if (e.which === 5 || e.button === 4)\n    {\n        console.log(\'"Forward" at \' + e.clientX + \'x\' + e.clientY);\n    }\n}\n\nwindow.addEventListener(\'mousedown\', onMouseDown);\ndocument.addEventListener(\'contextmenu\', e => e?.cancelable && e.preventDefault());

\r\n

"How To Keep People From Pushing Your Buttons" by Albert Ellis

\r\n

\r\n

\r\n

\n

\n

苹果系统

\n

\n

在 Windows 和 Linux 上有修饰键Alt,Shift和Ctrl。在 Mac 上，\xe2\x80\x99s 多了一个：Cmd，对应于属性metaKey...
\n即使我们\xe2\x80\x99d 喜欢强迫 Mac 用户Ctrl+ click\xe2\x80\x93 表示\xe2\x80\x99s有点困难。问题是：a left-clickwith在 MacOS 上Ctrl被解释为 a right-click，并且它生成contextmenu事件，而不是click像 Windows/Linux 那样。
\n因此，如果我们希望所有操作系统的用户都感到舒适，那么ctrlKey我们应该一起检查metaKey.
\n对于 JS 代码，这意味着我们应该检查if (event.ctrlKey || event.metaKey)...

\n

\n

资料来源：在本章中，我们将详细了解鼠标事件及其属性......

\n

\n

来源： https: //amazon.com/dp/B07DZWLPG9

\n\n

相关：Event 接口的“可取消”只读属性...

\n

Answer 4

您可以使用该事件window.oncontextmenu,例如:

window.oncontextmenu = function () {
  alert('Right Click')
}

<h1>Please Right Click here!</h1>

Answer 5

如果要检测鼠标右键单击，则不应使用MouseEvent.which属性，因为它是非标准的，并且浏览器之间存在很大的不兼容性。（请参阅MDN）您应该改为使用MouseEvent.button. 它返回一个代表给定按钮的数字：

• 0: 主键按下，一般为左键或未初始化状态
• 1：按下的辅助按钮，通常是滚轮按钮或中间按钮（如果有）
• 2: 次要按钮按下，通常是右键
• 3：第四个按钮，通常是浏览器后退按钮
• 4：第五个按钮，通常是浏览器前进按钮

MouseEvent.button 处理比标准鼠标更多的输入类型：

按钮的配置可能与标准的“从左到右”布局不同。配置为左手使用的鼠标可能具有相反的按钮操作。一些指点设备只有一个按钮，并使用键盘或其他输入机制来指示主要、次要、辅助等。其他的可能有许多按钮映射到不同的功能和按钮值。

参考：

1. https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/which
2. https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button

Answer 6

雅,虽然w3c说点击事件可以检测到右键点击,但是在通常的浏览器中没有通过右击来触发onClick.

实际上,右键单击只触发onMouseDown onMouseUp和onContextMenu.

因此,您可以将"onContextMenu"视为右键单击事件.这是一个HTML5.0标准.