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


当前回答

最简单的右击方式是使用

 $('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      
    }
});

其他回答

您可能想尝试以下属性:

按钮- (caniuse); Which - (caniuse)(弃用)。


function onMouseDown(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 at ' + e.clientX + 'x' + e.clientY);
    }

    if (e.which === 3 || e.button === 2)
    {
        console.log('Right mouse button at ' + e.clientX + 'x' + e.clientY);
    }

    if (e.which === 4 || e.button === 3)
    {
        console.log('Backward mouse button at ' + e.clientX + 'x' + e.clientY);
    }

    if (e.which === 5 || e.button === 4)
    {
        console.log('Forward mouse button at ' + e.clientX + 'x' + e.clientY);
    }
}

window.addEventListener("mousedown", onMouseDown);

document.addEventListener("contextmenu", function(e)
{
    e.preventDefault();
});

相关:演示


操作系统

On Windows and Linux there are modifier keys Alt, Shift and Ctrl. On Mac there’s one more: Cmd, corresponding to the property metaKey... Even if we’d like to force Mac users to Ctrl+click – that’s kind of difficult. The problem is: a left-click with Ctrl is interpreted as a right-click on MacOS, and it generates the contextmenu event, not click like Windows/Linux. So if we want users of all operating systems to feel comfortable, then together with ctrlKey we should check metaKey. For JS-code it means that we should check if (event.ctrlKey || event.metaKey)...

在本章中,我们将详细介绍鼠标事件及其属性……

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

如果您想检测鼠标右键单击,就不应该使用MouseEvent。哪个属性是不标准的,浏览器之间有很大的不兼容性。你应该使用MouseEvent.button。它返回一个表示给定按钮的数字:

0:主按钮按下,通常是左键或未初始化状态 1:辅助按钮按下,通常是车轮按钮或中间按钮(如果有) 2:二级按钮按下,通常是右键 3:第四个按钮,通常是浏览器返回按钮 4:第五个按钮,通常是浏览器前进按钮

MouseEvent。按钮处理的输入类型比标准鼠标更多:

按钮的配置可能与标准不同 “从左到右”的布局。配置为左撇子使用的鼠标可以 将按钮动作反转。有些指向设备只有一个 按钮,并使用键盘或其他输入机制来指示主, 二级、辅助性等。其他的可能有许多映射到的按钮 不同的功能和按钮值。

参考:

https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/which https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/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
}

没有,但是你可以检测到在"onmousedown"事件中使用了什么鼠标按钮…然后从那里判断它是否是一个“右键”。

大多数使用mouseup或上下文菜单事件的给定解决方案在每次鼠标右键上升时触发,但它们不会检查鼠标右键之前是否下降。


如果您正在寻找一个真正的右键单击事件,该事件仅在同一元素中按下并释放鼠标按钮时触发,那么您应该使用auxclick事件。由于这将触发每个非主鼠标按钮,您还应该通过检查按钮属性过滤其他事件。

窗口。addEventListener("auxclick", (event) => { 如果事件。button === 2) alert("Right click"); });

你也可以通过在JavaScript开头添加以下代码来创建自己的右键事件:

{
  const rightClickEvent = new CustomEvent('rightclick', { bubbles: true });
  window.addEventListener("auxclick", (event) => {
    if (event.button === 2) {
      event.target.dispatchEvent(rightClickEvent);
    }
  });
}

然后你可以通过addEventListener方法监听右键事件,如下所示:

your_element.addEventListener("rightclick", your_function);

在MDN上阅读更多关于auxclick事件的信息。