如何使用 JavaScript 打开锚点上下文菜单?

Dan*_*ock 5 html javascript anchor mouseevent

我正在尝试仅使用 JavaScript 打开锚点上下文菜单,例如对于此 HTML:

<html>
  <head></head>
  <body>
    <a href="https://stackoverflow.com" id="anchor-el"> Anchor </a>
  </body>
</html>
Run Code Online (Sandbox Code Playgroud)

我想仅使用 JavaScript 来打开带有本机“在链接新选项卡中打开”和“在新窗口中打开链接”选项的上下文菜单。

到目前为止,我已经尝试过这个,它似乎成功地将contextmenu事件分派到锚点,但上下文菜单实际上并未显示......

document.getElementById('anchor-el').dispatchEvent(new MouseEvent('contextmenu', { bubbles: true }))
Run Code Online (Sandbox Code Playgroud)

Wol*_*DEV -1

无法打开本机系统上下文菜单,例如默认的右键单击上下文菜单。
当然,您可以使用 jQuery 创建自己的上下文菜单,例如: https:
//swisnl.github.io/jQuery-contextMenu/

作为如何使用该库的示例:

 $(function() {
        $.contextMenu({
            selector: '#example', 
            trigger: 'left',
            callback: function(key, options) {
                var m = "clicked: " + key;
                window.console && console.log(m) || alert(m); 
            },
            items: {
                "edit": {name: "Edit", icon: "edit"},
                "cut": {name: "Cut", icon: "cut"},
               copy: {name: "Copy", icon: "copy"},
                "paste": {name: "Paste", icon: "paste"},
                "delete": {name: "Delete", icon: "delete"},
                "sep1": "---------",
                "quit": {name: "Quit", icon: function(){
                    return 'context-menu-icon context-menu-icon-quit';
                }}
            }
        });
        
        /* prevent the default switching to the target site */
        $("#example").on("click", function(event) { 
            event.preventDefault(); 
        });
    });
Run Code Online (Sandbox Code Playgroud)
<link href="https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.7.1/jquery.contextMenu.min.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.7.1/jquery.contextMenu.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-contextmenu/2.7.1/jquery.ui.position.js"></script>

<a href="https://google.com" id="example">click me</a>
Run Code Online (Sandbox Code Playgroud)