右键单击 Javascript 事件吗?

IT技术 javascript
2021-01-21 02:41:19

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

6个回答

正如其他人提到的,鼠标右键可以通过通常的鼠标事件(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

请记住,在 Mac FF 上ctrl+rightclick将通过鼠标左键单击(e.which === 1),而在 Mac Chrome 上ctrl+rightclick将作为预期的鼠标右键单击(e.ctrlKey && e .which === 3)。
2021-03-25 02:41:19
在 Chrome 59 中,鼠标右键会触发onmousedownonmouseup,但不会触发onclick显然,在 Chrome 中,onclick仅针对鼠标左键触发。(是的,伙计们,我对此进行了多次测试)为了检测鼠标右键单击,您必须结合onmousedownonmouseup,或使用oncontextmenu.
2021-03-30 02:41:19
就像 which/button 问题一样,“oncontextmenu”在所有浏览器中的实现并不相同……请参阅quirksmode.org/dom/events/contextmenu.html以了解一些“问题”。
2021-04-10 02:41:19

看看下面的jQuery代码:

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

whichwill的值是:

  • 1为左按钮
  • 2中键
  • 3为右键
oop,太可怕了!为什么.which不一样.button.button=> 0,1,2 ; which=> 1,2,3那是错误的。
2021-03-21 02:41:19

您可以使用 event window.oncontextmenu,例如:

window.oncontextmenu = function () {
  alert('Right Click')
}
<h1>Please Right Click here!</h1>

@BrianAllanWest 是 jQuery 吗?我不知道如何使用它。window.oncontextmenu = function () { e.preventDefault() }没有用。
2021-03-15 02:41:19
这也触发了左mb
2021-03-22 02:41:19
@Shayan e.preventDefault()
2021-03-23 02:41:19
真棒 +1,现在如何阻止上下文菜单?@用户12345678
2021-03-27 02:41:19
@Shayan,不,它是原始的 javascript ......你会像这样使用它...... window.oncontextmenu = function(e) { e.preventDefault();} 这可以防止浏览器在上下文菜单中的默认行为(即:鼠标右键单击或按住 mac) 被按下。
2021-04-07 02:41:19

如果要检测鼠标右键单击,则不应使用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

是的,虽然 w3c 说单击事件可以检测到右键单击,但在通常的浏览器中,不会通过右键单击来触发 onClick。

实际上,右键单击仅触发 onMouseDown onMouseUp 和 onContextMenu。

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

是的,听起来是个不错的解决方案,尤其是当您针对较新的浏览器时。我不认为这只是一个 HTML5.0,因为即使是 IE 5.5 也支持它的元素!以下是有关哪些浏览器支持它的更多信息:quirksmode.org/dom/events/contextmenu.html
2021-03-25 02:41:19