如何在元素上触发浏览器上下文菜单。 （好像用户右键单击）

Question

我需要通过javascript触发浏览器（IE，Firefox，Safari等）上下文菜单的打开。我试图解决的问题是，当右键单击重叠元素时，它下面的元素显示其上下文菜单。因此，如果顶部元素是标签，当您右键单击时，我需要显示下面输入元素的上下文菜单。

我知道如何保持标签的上下文菜单不显示，但我不知道如何随意打开上下文菜单。

感谢任何帮助！

Answer 1

很抱歉成为不幸新闻的持有者，但这与Javascript无关。

Answer 2

我不想挫败你，恰恰相反，特别是因为你回答了我自己的问题：）

我认为浏览器的竞赛菜单不能通过网页上的普通脚本访问。

如果您要求的内容实际上是可行的，那么浏览器制造商可能会认为这是一个错误并删除此行为。跨浏览器，这种行为今天不太可能出现。

为什么不捕捉鼠标事件，只要鼠标直接位于您想要显示上下文菜单的元素区域内，请按下面的覆盖元素，否则返回顶部？

这是我能想到的一种可能性，基本上是根据鼠标位置显示/暴露隐藏元素。就像在覆盖层上切一个洞一样。

或者为什么不将文本字段透明并将叠加层完全放在文本字段下面？

如果这在技术上不成功，那么至少你有责任针对目标浏览器提交错误或增强功能。

顺便说一句，如果用户直接右键单击插入符号的位置，上下文菜单实际上可以正常工作，所以这可能是您需要考虑的另一个漏洞。

Answer 3

我有一个可能适合您需求的解决方案。它还不完美，我只在几个浏览器中做过一些快速测试（Fox 3.6，IE7，IE8，Chrome 4，xp上的Safari 3）它需要进行调整和改进，但它是一个开始。基本上，我们的想法是删除右键单击mousedown上的标签，以便鼠标事件命中所需的字段，从而激活相关字段的上下文菜单。

// Remove the contextmenu from "In-Field" Labels
base.$label.bind("contextmenu",function(e){
    return false;
}); 

// Detect right click on "In-Field" label:
// hide label on mousedown so mouseup will target the field underneath.
base.$label.mousedown(function(e){          
    if ( e.which == 3 ){
        var elLbl = $(this); 
        elLbl.hide();
        var elFid = $(this).attr("for");
        // bind blur event to replace the label when we are done.
        $("#" + elFid ).bind("blur.infieldlabel",function(){                    
            elLbl.show();
            $("#" + elFid ).unbind("blur.infieldlabel");                    
        });             
        return false;
    }
}); 

IE浏览器和Safari浏览器遇到一个奇怪的问题，您需要在标签再次显示之前单击两次进出（我认为与事件计时有关）。您可以通过查看代码轻松了解为什么会发生这种情况。在粘贴到田野后，有时候注意到狐狸有时会出现轻微的毛刺，在模糊不清的情况下，标签出现了一瞬间。如果您决定将此方法合并到您的代码中，这应该是一个相当简单的事情。