如何在javascript中捕获新标签事件中的打开链接？

Posted 2023-05-07

【中文标题】如何在javascript中捕获新标签事件中的打开链接？

【英文标题】：how to capture the open link in new tab event in javascript?

【发布时间】：2018-04-08 21:54:54

【问题描述】：

我能够捕获右键单击事件，但我想知道的是如何捕获右键单击后发生的“在新选项卡中打开链接”

【问题讨论】：

恐怕不可能。上下文菜单中的事件本身是否比 JS 可以访问的级别更低。

你有什么建议？基本上左键打开的链接是使用js动态创建的。但是在右键单击并在新选项卡中打开时，链接不会更新。原始 href 属性的值是“#”

在这种情况下，您需要在 DOM 中设置实际的 href 属性，而不是在元素的 click() 上计算它。或者，您可以在 click 和 contextmenu 事件处理程序中设置 href。

可能与***.com/questions/850058/…重复

【参考方案1】：

我刚刚面临同样的问题。这是我想出的解决方法。 当上下文菜单在我感兴趣的链接上打开时，我会聆听上下文菜单，然后更改 href 值

$(".my-links").contextmenu(function(event)
        // your logic here 
        // for me it was to add the portocal + "://" + hostname + "/#" + value of the original link
        var $link = $(this);
        var href = $link.attr('href');
        // Check if I have already done this
        if(href.includes('/#'))
            return true; // return if it doesn't need editing
        var url = window.location.href;
        url = url.split("/");
        url = url[0]+'//'+url[2];
        $link.attr('href', url + '/#' + href);
    );

现在您可以选择执行一些操作来从此操作中恢复。这完全取决于您的情况以及您要做什么。对我来说，我需要将href恢复为正常点击的原始值，因为我使用ajax加载页面，我只需要“/#”之后的部分（这是加载函数需要的，我无法控制过度更改该功能） 这就是我所做的。

$(".my-links").click(function(event)
        // your logic goes here
        // for me it was to remove portocal + "://" + hostname + "/#" (if they exist)
        event.preventDefault();
        var $link = $(this);
        var href = $link.attr('href');
        if(!href.includes("/#"))
            return ajaxLoad(href); // the function used to load the page with ajax
        var url = href.split("/#");
        ajaxLoad(url[url.length-1]); // the function used to load the page with ajax
    );

这些行很长的东西应该适合你。

收听上下文菜单事件并执行您的逻辑。

如果您需要恢复更改，请找出最合适的事件来恢复更改（如果已发生）并执行恢复过程。