捕获“在新选项卡中打开链接”和“在新窗口中打开链接”事件

Posted 2023-05-07

【中文标题】捕获“在新选项卡中打开链接”和“在新窗口中打开链接”事件

【英文标题】：capture "open link in new tab" and "Open link in new window" event

【发布时间】：2017-07-27 19:22:30

【问题描述】：

这是我的代码

<a href="javascript:void(0)" onclick="myFun('www.google.com');" onmousedown="myFun('www.google.com');">

每当我单击此链接时，都会使用 onclick 事件调用我的函数。我为右键捕获添加了 onmousedown 事件。但问题是，在选择 "Open in new tab" 或 "Open in new window" 选项之前调用此函数。当用户使用右键单击并在选择右键单击选项之前，该函数被调用。我不想要这种行为。我想在用户实际选择“在新标签中打开链接”或“在新窗口中打开链接”选项时调用此函数。

我不想在状态栏中显示链接，也不想让用户复制链接地址。这就是我使用 onclick 和 onmousedown 事件的原因。

请帮帮我。谢谢

【问题讨论】：

这些是浏览器事件，不是网页事件

没有什么可以告诉你用户选择了那些。

我不能只使用 oncontextmenu 事件。如果我这样做，它会给我一个异常 - JSPG0227E: 翻译 /abc.jsp 时捕获异常：/abc.jsp(160,10) --> JSPG0123E: 无法找到标记属性 oncontextmenu 的标记属性信息

【参考方案1】：

您遇到的问题是，右击和左击都是使用 onclick 函数处理的。另一种可能性是使用 oncontextmenu（如 here 所述）。

但我认为您需要以不同的方式处理右键单击和左键单击，因此 onclick 是正确的事件，只需检查它是主要 (0) 还是次要 (2) 鼠标按钮（请参阅here）。所以你的解决方案可能是这样的：

myFun(link) 
    var buttonPressed = instanceOfMouseEvent.button;
    if (buttonPressed == 0) 
         //Handle normal click
     else if (buttonPressed == 2) 
         //Handle right click 
    

【讨论】：

可以查到右键事件。但我想找出用户实际选择“在新选项卡中打开”或“在新窗口中打开”选项时的事件。我的功能在选择这些选项之前被触发。因为我的代码能够找到右键单击事件。我不想要它。我的功能应该在选择选项后触发

@NiteshAarne 你可能想看看building your own context menu。这样您就可以更好地控制所发生的事情。

在我的示例中，我想发送要打开的链接。我正在做的是，我想将该链接传递给一个 JS 函数，并想使用 JS 创建一个表单。然后使用 form.submit() 提交表单；我的 URL 包含一些我不想在地址栏中显示的参数。我正在创建表单并将其提交给 POST 请求。

我不能只使用 oncontextmenu 事件。如果我这样做，它会给我一个异常 - JSPG0227E: 翻译 /abc.jsp 时捕获异常：/abc.jsp(160,10) --> JSPG0123E: 无法找到标签属性 oncontextmenu 的标签属性信息。

@NiteshAarne 正如 freginold 所说，这是构建您自己的上下文菜单的最佳方式。因为您可以使用自己的功能，并且在控制用户选择方面没有问题。

【参考方案2】：

听起来您正在寻找这样的东西，一旦启动上下文菜单就会改变链接：

function myFun2(url) 
   linkEl.href = url;

然后为a元素分配一个ID（即“linkEl”），删除onmousedown处理程序，并分配一个oncontextmenu处理程序，如：

oncontextmenu="myFun2('www.google.com');"

然后当上下文菜单启动时，链接会改变，所以如果选择“在新选项卡中打开”或“在新窗口中打开”，它将转到谷歌（在本例中）而不是任何链接设置为以前的。

【讨论】：

:- 在我的示例中，我想发送要打开的链接。我正在做的是，我想将该链接传递给一个 JS 函数，并想使用 JS 创建一个表单。然后使用 form.submit() 提交表单；我的 URL 包含一些我不想在地址栏中显示的参数。我正在创建表单并将其提交给 POST 请求。