如何检测超链接的右键单击上下文菜单中的哪个选项被单击?

时间:2019-01-30 00:05:39

标签: javascript html browser hyperlink contextmenu

假设我使用的是默认浏览器的上下文菜单。

  • 例如,如何找到该用户从右键单击上下文菜单中选择了“复制链接位置”?
  • 在执行“复制链接位置”操作后,如何覆盖默认行为? (例如,替换链接,但是如果用户选择“在新标签页中打开”,它仍将是原始链接)。

编辑:关闭链接的上下文菜单后,即使在剪贴板中,即使用户选择的选项不同于“复制链接位置”,也可以替换剪贴板中的链接。

3 个答案:

答案 0 :(得分:5)

不幸的是,出于安全原因,不可能检测在默认浏览器的上下文菜单中选择的内容。

出于安全原因,不可能覆盖默认浏览器的上下文菜单上的覆盖默认功能/操作。

您可以做什么:

  1. 使用浏览器扩展程序(最终用户应首先安装扩展程序),您可以将自己的带有图标和功能的自定义选项添加到默认浏览器的上下文菜单中。

  2. 您可以在鼠标右键单击时覆盖默认行为。例如,右键单击后,您可以显示具有自己功能的自定义上下文菜单。


编辑:我对OP(原始张贴者)的第一条评论的回答:

右键单击并发生oncotextmenu事件后的链接替换与您要解决的问题无关!我写已经是

以上
  

您可以在鼠标右键单击时覆盖默认行为

这也意味着您可以在右键单击后替换链接,但是在您的问题中,您想从默认上下文中单击特定菜单选项后替换链接菜单。出于安全原因,这不可能

您必须阅读有关 oncontextmenu event

  

通常,在窗口上单击鼠标右键时会触发contextmenu事件。除非阻止默认行为,否则浏览器上下文菜单将激活。

答案 1 :(得分:4)

  

已编辑:在关闭链接的右侧后,替换剪贴板中的链接   上下文菜单(即使用户选择的选项不同于“复制链接”   位置”)也是可以接受的解决方案。

如果用户授予适当的permissions,则可以使用contextmenu事件,focusout附加到window事件处理程序中的contextmenuAsync Clipboard API < / p>

<body>
  <a id="a" href="#">click</a>
  <script>
    a.addEventListener('contextmenu', e => {
      console.log(e);
      window.addEventListener("focusout", e => {
        console.log(e);
        navigator.clipboard.writeText(a.href)
          .then(() => {
            console.log('Text copied to clipboard');
          })
          .catch(err => {
            // This can happen if the user denies clipboard permissions:
            console.error('Could not copy text: ', err);
          });
        navigator.clipboard.readText()
          .then(text => {
            console.log('Pasted content: ', text);
          })
          .catch(err => {
            console.error('Failed to read clipboard contents: ', err);
          });
      }, {
        once: true
      });
    });
  </script>
</body>

plnkr

答案 2 :(得分:-1)

contextmenu用于标识right click,例如:

$('{IdOrClass}').on('click contextmenu', "a", function(event) {
   alert("Right clicked"); // do whatever you want on right click
});