我试图在一个新的选项卡中打开一个URL,而不是弹出窗口。

我见过一些相关的问题,其中的回答大致如下:

window.open(url,'_blank');
window.open(url);

但没有一个对我有效,浏览器仍然试图打开一个弹出窗口。


当前回答

function openTab(url) {
  const link = document.createElement('a');
  link.href = url;
  link.target = '_blank';
  document.body.appendChild(link);
  link.click();
  link.remove();
}

其他回答

如果您只想打开外部链接(指向其他站点的链接),那么JavaScript/jQuery的这一功能很好:

$(function(){
    var hostname = window.location.hostname.replace('www.', '');
    $('a').each(function(){
        var link_host = $(this).attr('hostname').replace('www.', '');
        if (link_host !== hostname) {
            $(this).attr('target', '_blank');
        }
    });
});

有很多答案副本建议使用“_blank”作为目标,但我发现这并不奏效。正如Prakash指出的,这取决于浏览器。但是,您可以向浏览器提出某些建议,例如窗口是否应具有位置栏。

如果你提出了足够多的“类似标签的东西”,你可能会得到一个标签,正如Nico对铬的这个更具体问题的回答:

window.open('http://www.stackoverflow.com', '_blank', 'toolbar=yes, location=yes, status=yes, menubar=yes, scrollbars=yes');

免责声明:这不是万能药。这仍然取决于用户和浏览器。现在,至少您为希望窗口的外观指定了一个首选项。

如果链接位于同一域(同一网站),浏览器将始终在新选项卡中打开该链接。如果链接在其他域上,它将在新的选项卡/窗口中打开,具体取决于浏览器设置。

因此,根据这一点,我们可以使用:

<a class="my-link" href="http://www.mywebsite.com" rel="http://www.otherwebsite.com">new tab</a>

并添加一些jQuery代码:

jQuery(document).ready(function () {
    jQuery(".my-link").on("click",function(){
        var w = window.open('http://www.mywebsite.com','_blank');
        w.focus();
        w.location.href = jQuery(this).attr('rel');
        return false;
    });
});

所以,首先用_blank target在同一个网站上打开新窗口(它将在新选项卡中打开),然后在新窗口中打开您想要的网站。

我使用了以下方法,效果很好!

window.open(url, '_blank').focus();
function openTab(url) {
  const link = document.createElement('a');
  link.href = url;
  link.target = '_blank';
  document.body.appendChild(link);
  link.click();
  link.remove();
}