正文

在新选项卡（而不是新窗口）中打开 URL

 2023-02-22  85

关键词：

【中文标题】在新选项卡（而不是新窗口）中打开 URL【英文标题】：Open a URL in a new tab (and not a new window) 【发布时间】：2011-06-21 22:13:27 【问题描述】：

我正在尝试在新标签中打开URL，而不是弹出窗口。

我已经看到相关问题的回复类似于：

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

但它们都不适合我，浏览器仍然试图打开一个弹出窗口。

【问题讨论】：

这通常是一个偏好问题。有些人喜欢windows（并强烈保护这种行为），有些人喜欢tabs（并强烈保护这种行为）。因此，您将击败通常被认为是品味问题而非设计问题的行为。 Javascript 对您的浏览器和标签与窗口一无所知，因此实际上由浏览器决定如何打开新窗口。如何配置 Chrome 以将其显示在新标签页中，而不是弹出窗口？ Gmail 以某种方式做到了这一点，至少在 Chrome 中是这样。 Shift+单击电子邮件行，然后在新窗口中打开该电子邮件。 Ctrl+单击，然后在新选项卡中打开它。唯一的问题：挖掘 gmail 的混淆代码是一个 PITA @Sergio，这是任何链接的默认浏览器行为。（至少对于 Chrome 和 Firefox。）与 Gmail 无关。 【参考方案1】：

这是一个诡计，

function openInNewTab(url) 
 window.open(url, '_blank').focus();


//or just
window.open(url, '_blank').focus();

在大多数情况下，这应该直接发生在链接的onclick 处理程序中，以防止弹出窗口阻止程序和默认的“新窗口”行为。您可以这样做，或者向您的 DOM 对象添加一个事件侦听器。

<div onclick="openInNewTab('www.test.com');">Something To Click On</div>

http://www.tutsplanet.com/open-url-new-tab-using-javascript/

【讨论】：

不起作用。在地址栏右侧收到一条消息：弹出窗口被阻止。然后我允许弹出窗口。瞧，它在弹出窗口中打开，而不是 tab！ OS X Lion 上的 Chrome 22.0.1229.94。 @b1naryatr0phy 那是因为您实际上没有正确测试它。更改浏览器中的设置。它是在选项卡中打开还是在窗口中打开取决于浏览器的设置。您无法通过调用 window.open（或任何 Javascript）来选择如何打开新窗口/选项卡。 var win = window.open(url, '_blank'); '_blank' 不是必需的，对于window.open()，第二个参数是strWindowName，用于：新窗口的字符串名称。使用或 @hydRANger 与 MDN 上的 window.open() 相同的链接：要在每次调用 window.open() 时打开新窗口，请为 windowName 使用特殊值 _blank。如果需要更改浏览器设置，请避免！【参考方案2】：

作者无法选择在新标签而不是新窗口中打开；这是一个用户偏好。（请注意，大多数浏览器中的默认用户首选项是针对新选项卡的，因此在未更改该首选项的浏览器上进行简单的测试不会证明这一点。）

CSS3 建议 target-new，但 the specification was abandoned。

The reverse is not true;通过在window.open() 的第三个参数中为窗口指定某些窗口功能，您可以在偏好选项卡时触发一个新窗口。

【讨论】：

为什么这是公认的答案？我已经测试了 duke 和 arikfr 给出的以下答案，它们在 FF、Chrome 和 Opera 中运行良好，除了 IE（它不起作用）和 Safari（它在新窗口而不是新标签中打开）。跨度> @AliHaideri Javascript 与新标签页/窗口的打开方式无关。这完全取决于您的浏览器设置。使用window.open 告诉浏览器打开新的东西，然后浏览器打开在其设置中选择的内容 - 选项卡或窗口。在您测试的浏览器中，将设置更改为在新窗口而不是选项卡中打开，您会看到其他人的解决方案是错误的。比告诉他们不能做的事情更浪费别人时间的两件事。 (1) 告诉他们不能做到的事情可以做到。（2）保持沉默，让他们继续寻找方法来做一些做不到的事情。 @Luke：如果只是如何在您自己的浏览器中获得此功能的问题，那可能是 SuperUsers 网站的问题。 @Bondye — 问题是关于新的 tabs 而不是新窗口。您获得新的 windows 的事实才是重点。【参考方案3】：

window.open() 不会在新标签页中打开，如果它没有发生在实际的点击事件中。在给出的示例中，URL 是在实际点击事件中打开的。 如果用户在浏览器中进行了适当的设置，这将起作用。

<a class="link">Link</a>
<script  type="text/javascript">
     $("a.link").on("click",function()
         window.open('www.yourdomain.com','_blank');
     );
</script>

同样，如果您尝试在 click 函数中执行 Ajax 调用并希望在成功时打开一个窗口，请确保您在执行 Ajax 调用时设置了 async : false 选项。

【讨论】：

最好将此标记为正确答案。我对 Chrome v26 (Windows) 的测试确认，如果代码在按钮的单击处理程序中，它会打开一个新选项卡，并且代码是否以编程方式调用，例如从控制台，然后它会打开一个新窗口。 @Ian 根据我对默认设置的浏览器的测试，这个答案适用于上述答案不适用的情况。仅当用户更改了默认设置时，“您无能为力”的公认答案才成立。 @Ian 为了清楚起见，我在回答有关用户设置的警告中提到了这一点。 “只要用户在浏览器中有适当的设置，这将起作用。”我认为大多数用户不会更改浏览器设置，这个答案适用于大多数人。 async: false 在 Chrome 中不起作用。要从回调中打开一个新窗口，您需要在发送 HTTP 请求之前先打开一个空窗口，然后再更新它。这是good hack。【参考方案4】：

function openInNewTab(href) 
  Object.assign(document.createElement('a'), 
    target: '_blank',
    href: href,
  ).click();

它创建一个虚拟 a 元素，给它 target="_blank" 所以它在一个新标签页中打开，给它正确的 url href 然后点击它。

然后你可以像这样使用它：

openInNewTab("https://google.com");

重要提示：

openInNewTab（以及此页面上的任何其他解决方案）必须在所谓的“受信任事件”回调期间调用 - 例如。 during 点击事件（直接在回调函数中不需要，但在点击动作期间）。否则打开新页面会被浏览器屏蔽

如果您在某个随机时刻（例如，在某个时间间隔内或在服务器响应之后）手动调用它 - 它可能会被浏览器阻止（这是有道理的，因为它存在安全风险并可能导致糟糕的用户体验)

【讨论】：

谢谢。你的纯 JS 有一个缺失的部分——正如 Luke Alderton 所写（见下文），你需要将创建的元素附加到文档正文中，在你的代码中它挂在空白中，至少在 Firefox 37 中它没有做任何事情. @mcginniwa 任何这样的动作——如果不是由鼠标点击等用户动作触发，就会变成弹出窗口阻止程序。想象一下，您可以在没有用户操作的情况下使用 Javascript 打开任何 url - 这将是非常危险的。如果您将此代码放在点击函数之类的事件中 - 它会正常工作 - 这里所有建议的解决方案都是一样的。您可以将代码简化如下：$('<a />','href': url, 'target', '_blank').get(0).click(); @shaedrich 受您的剪辑启发我添加了非 jquery 单行：Object.assign(document.createElement('a'), target: '_blank', href: 'URL_HERE').click(); @shaedrich- 如何在您提供的代码中包含一个文本，该文本将具有页面链接（指定 bu url）？【参考方案5】：

`window.open` 无法在所有浏览器的新选项卡中可靠地打开弹出窗口

不同的浏览器以不同的方式实现window.open的行为，尤其是在用户的浏览器偏好方面。你不能期望window.open的行为相同在所有 Internet Explorer、Firefox 和 Chrome 中都是如此，因为它们处理用户浏览器首选项的方式不同。

例如，Internet Explorer (11) 用户可以选择在新窗口或新标签页中打开弹窗，您不能强制 Internet Explorer 11 用户通过某种方式打开弹窗 @987654331 @，正如Quentin's answer 中提到的那样。

对于 Firefox (29) 用户，使用 window.open(url, '_blank') 取决于他们浏览器的选项卡首选项，尽管您仍然可以通过指定宽度和高度来强制他们在新窗口中打开弹出窗口（参见“Chrome 怎么样？”部分）。

演示

转到浏览器的设置并将其配置为在新窗口中打开弹出窗口。

Internet Explorer (11)

测试页

如上所示设置 Internet Explorer (11) 以在新窗口中打开弹出窗口后，使用以下测试页面测试window.open：

<!DOCTYPE html>
<html>
  <head>
    <title>Test</title>
  </head>

  <body>
    <button onclick="window.open('https://***.com/q/4907843/456814');">
      <code>window.open(url)</code>
    </button>
    <button onclick="window.open('https://***.com/q/4907843/456814', '_blank');">
      <code>window.open(url, '_blank')</code>
    </button>
  </body>
</html>

注意弹出窗口是在新窗口中打开的，而不是新标签页。

您还可以在 Firefox (29) 中测试上面的那些 sn-ps，并将其选项卡首选项设置为新窗口，并查看相同的结果。

Chrome 怎么样？它实现 `window.open` 与 Internet Explorer (11) 和 Firefox (29) 不同。

我不能 100% 确定，但 Chrome（版本 34.0.1847.131 m）似乎没有任何设置可供用户用来选择是否在新窗口或新标签页中打开弹出窗口（就像 Firefox 和 Internet Explorer 一样）。我检查了the Chrome documentation for managing pop-ups，但它没有提到任何关于这种事情的内容。

另外，再一次，不同的浏览器似乎实现了window.open的行为不同。在 Chrome 和 Firefox 中，指定宽度和height 将强制弹出， 即使用户已将 Firefox (29) 设置为在新标签页中打开新窗口（如JavaScript open in a new window, not tab 的答案中所述）：

<!DOCTYPE html>
<html>
  <head>
    <title>Test</title>
  </head>

  <body>
    <button onclick="window.open('https://***.com/q/4907843/456814', 'test', 'width=400, height=400');">
      <code>window.open(url)</code>
    </button>
  </body>
</html>

但是，如果用户将标签页设置为浏览器首选项，上述代码 sn-p 将始终在 Internet Explorer 11 中打开一个新标签页，即使不指定宽度和高度也会强制打开一个新窗口为他们弹出窗口。

因此，Chrome 中 window.open 的行为似乎是在 onclick 事件中使用时在新选项卡中打开弹出窗口，在浏览器控制台 (as noted by other people) 中使用时在新窗口中打开它们，以及在指定宽度和高度时在新窗口中打开它们。

总结

不同的浏览器实现window.open的行为在用户的浏览器偏好方面有所不同。您不能期望window.open的行为在所有浏览器中都适用Internet Explorer、Firefox 和 Chrome，因为它们处理用户浏览器首选项的方式不同。

补充阅读

window.open documentation。

【讨论】：

你没有回答问题，你只是证明window.open不一致。请提供解决方案，这个“答案”需要解决方案【参考方案6】：

如果您使用window.open(url, '_blank')，它将在 Chrome 上被阻止（弹出窗口阻止程序）。

试试这个：

//With JQuery

$('#myButton').click(function () 
    var redirectWindow = window.open('http://google.com', '_blank');
    redirectWindow.location;
);

使用纯 JavaScript，

document.querySelector('#myButton').onclick = function() 
    var redirectWindow = window.open('http://google.com', '_blank');
    redirectWindow.location;
;

【讨论】：

但是在这个问题中，他们没有提到网站作者。只想在新窗口或新标签中打开一个网址。这取决于浏览器。我们不需要担心作者。请检查那个小提琴。它正在工作发现，在js fiddle和plunker上不起作用，但是在创建html文件时起作用。是因为js fiddle，输出显示在iframe上，所以新窗口被the request was made in a sandboxed frame whose 'allow-popups' permission is not set挡住了【参考方案7】：

我使用以下，效果很好！

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

【讨论】：

这可能会在新选项卡或新窗口中打开，具体取决于浏览器设置。这个问题特别是关于在新选项卡中打开，即使首选项是针对新窗口的。没错，但正如我们已经确定的那样。在选项卡或窗口中打开是用户偏好。在新窗口或标签中打开网址的答案非常简单。【参考方案8】：

为了详细说明史蒂文·斯皮尔伯格的回答，我在这种情况下这样做了：

$('a').click(function() 
  $(this).attr('target', '_blank');
);

这样，就在浏览器跟随链接之前，我设置了目标属性，因此它将使链接在新选项卡或窗口中打开（取决于用户的设置）。

jQuery中的一行示例：

$('a').attr('target', '_blank').get(0).click();
// The `.get(0)` must be there to return the actual DOM element.
// Doing `.click()` on the jQuery object for it did not work.

这也可以仅使用本机浏览器 DOM API 来完成：

document.querySelector('a').setAttribute('target', '_blank');
document.querySelector('a').click();

【讨论】：

【参考方案9】：

我认为你无法控制这一点。如果用户已将其浏览器设置为在新窗口中打开链接，则您不能强制它在新选项卡中打开链接。

JavaScript open in a new window, not tab

【讨论】：

【参考方案10】：

一个有趣的事实是，如果用户没有调用该操作（单击按钮或其他东西）或者它是异步的，则无法打开新选项卡，例如，这不会在新选项卡中打开：

$.ajax(
    url: "url",
    type: "POST",
    success: function() 
        window.open('url', '_blank');              
    
);

但这可能会在新标签页中打开，具体取决于浏览器设置：

$.ajax(
    url: "url",
    type: "POST",
    async: false,
    success: function() 
        window.open('url', '_blank');              
    
);

【讨论】：

这在 Firefox 28、Chrome 34b 和 Safari 7.0.2 中作为弹出窗口被阻止，所有库存设置。 :( “如果操作不是由用户调用（单击按钮或其他东西）或者它是异步的，则无法打开新选项卡” - Chrome 的 true，但并非所有浏览器都如此。将<script>open('http://google.com')</script> 保存到.html 文件并在最新版本的Firefox 的全新安装中打开它；您会观察到 Firefox 在新标签页中愉快地打开 Google（可能是在您告诉它允许弹出窗口之后），而不是新窗口。【参考方案11】：

只是省略 [strWindowFeatures] 参数将打开一个新选项卡，除非浏览器设置覆盖（浏览器设置胜过 JavaScript）。

新窗口

var myWin = window.open(strUrl, strWindowName, [strWindowFeatures]);

新标签

var myWin = window.open(strUrl, strWindowName);

-- 或--

var myWin = window.open(strUrl);

【讨论】：

【参考方案12】：

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

【讨论】：

这可能会在新选项卡或新窗口中打开，具体取决于浏览器设置。这个问题特别是关于在新标签页中打开，即使首选项是针对新窗口的。我认为这是最干净的解决方案【参考方案13】：

是在新标签页还是新窗口中打开 URL，实际上是由用户的浏览器偏好控制的。无法在 JavaScript 中覆盖它。

window.open() 的行为因使用方式而异。如果它作为用户操作的直接结果调用，让我们说一个按钮单击，它应该可以正常工作并打开一个新选项卡（或窗口）：

const button = document.querySelector('#openTab');

// add click event listener
button.addEventListener('click', () => 
    // open a new tab
    const tab = window.open('https://attacomsian.com', '_blank');
);

但是，如果您尝试通过 AJAX 请求回调打开新标签页，浏览器将阻止它，因为这不是用户的直接操作。

要绕过弹出窗口拦截器并从回调中打开一个新标签，这里是little hack：

const button = document.querySelector('#openTab');

// add click event listener
button.addEventListener('click', () => 

    // open an empty window
    const tab = window.open('about:blank');

    // make an API call
    fetch('/api/validate')
        .then(res => res.json())
        .then(json => 

            // TODO: do something with JSON response

            // update the actual URL
            tab.location = 'https://attacomsian.com';
            tab.focus();
        )
        .catch(err => 
            // close the empty window
            tab.close();
        );
);

【讨论】：

不知道为什么这被否决 - 这对我有用，似乎是在回调中打开标签的聪明方法。 @stevex — 它回答的问题与所提出的问题完全不同。这个答案是关于与弹出窗口拦截器交互，而不是在发送用户的浏览器首选项以打开新窗口时打开新标签。【参考方案14】：

(function(a)
document.body.appendChild(a);
a.setAttribute('href', location.href);
a.dispatchEvent((function(e)
    e.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0, true, false, false, false, 0, null);
    return e
(document.createEvent('MouseEvents'))))(document.createElement('a')))

【讨论】：

【参考方案15】：

这与浏览器设置无关，如果您尝试从自定义函数打开新标签。

在此页面中，打开 JavaScript 控制台并输入：

document.getElementById("nav-questions").setAttribute("target", "_blank");
document.getElementById("nav-questions").click();

无论您的设置如何，它都会尝试打开一个弹出窗口，因为“点击”来自自定义操作。

为了在链接上表现得像真正的“鼠标点击”，您需要关注@spirinvladimir's advice 并真正创建它：

document.getElementById("nav-questions").setAttribute("target", "_blank");
document.getElementById("nav-questions").dispatchEvent((function(e)
  e.initMouseEvent("click", true, true, window, 0, 0, 0, 0, 0,
                    false, false, false, false, 0, null);
  return e
(document.createEvent('MouseEvents'))));

这是一个完整的示例（不要在jsFiddle 或类似的在线编辑器上尝试，因为它不会让您从那里重定向到外部页面）：

<!DOCTYPE html>
<html>
<head>
  <style>
    #firing_div 
      margin-top: 15px;
      width: 250px;
      border: 1px solid blue;
      text-align: center;
    
  </style>
</head>
<body>
  <a id="my_link" href="http://www.google.com"> Go to Google </a>
  <div id="firing_div"> Click me to trigger custom click </div>
</body>
<script>
  function fire_custom_click() 
    alert("firing click!");
    document.getElementById("my_link").dispatchEvent((function(e)
      e.initMouseEvent("click", true, true, window, /* type, canBubble, cancelable, view */
            0, 0, 0, 0, 0,              /* detail, screenX, screenY, clientX, clientY */
            false, false, false, false, /* ctrlKey, altKey, shiftKey, metaKey */
            0, null);                   /* button, relatedTarget */
      return e
    (document.createEvent('MouseEvents'))));
  
  document.getElementById("firing_div").onclick = fire_custom_click;
</script>
</html>

【讨论】：

我最终选择了一个不同的解决方案，我按照 w = window.open("placeholder"); $.ajax(...ajax call that returns the url...) success (...w.location = data.url...) 执行 theandystratton.com/2012/… @FahadAbidJanjua 这绝对是不正确的。 它仍然取决于浏览器设置。 HTML 或 Javascript 规范中没有任何内容声明“自定义操作”必须在弹出窗口而不是选项卡中打开。事实上，我当前机器上的没有个浏览器显示这种行为。【参考方案16】：

你可以使用form的技巧：

$(function () 
    $('#btn').click(function () 
        openNewTab("http://***.com")
        return false;
    );
);

function openNewTab(link) 
    var frm = $('<form   method="get" action="' + link + '" target="_blank"></form>')
    $("body").append(frm);
    frm.submit().remove();

jsFiddle demo

【讨论】：

如果你使用这种方法，请确保 url 没有查询参数，因为它们会被表单提交跳过。一种解决方案是在表单元素中嵌入隐藏的输入元素，其中name 作为键，value 作为查询参数中所有参数的值。然后提交表单这可以更简单地使用a 标签而不是表单来完成，并使用jQuery .click() 方法来“提交”它。检查my answer【参考方案17】：

jQuery

$('<a />','href': url, 'target': '_blank').get(0).click();

Object.assign(document.createElement('a'),  target: '_blank', href: 'URL_HERE').click();

【讨论】：

这可能会在新选项卡或新窗口中打开，具体取决于浏览器设置。这个问题特别是关于在新标签页中打开，即使首选项是针对新窗口的。【参考方案18】：

或者您可以创建一个链接元素并单击它...

var evLink = document.createElement('a');
evLink.href = 'http://' + strUrl;
evLink.target = '_blank';
document.body.appendChild(evLink);
evLink.click();
// Now delete it
evLink.parentNode.removeChild(evLink);

这不应该被任何弹出窗口阻止程序阻止......希望。

【讨论】：

【参考方案19】：

这个问题有答案，不是没有。

我找到了一个简单的解决方法：

第 1 步：创建隐形链接：

<a id="yourId" href="yourlink.html" target="_blank" style="display: none;"></a>

第 2 步：以编程方式点击该链接：

document.getElementById("yourId").click();

给你！对我很有魅力。

【讨论】：

这可能会在新选项卡或新窗口中打开，具体取决于浏览器设置。这个问题特别是关于在新标签页中打开，即使首选项是针对新窗口的。【参考方案20】：

不要使用 target="_blank"

在我的例子meaningfulName 中，始终为该窗口使用特定名称，在这种情况下，您可以节省处理器资源：

button.addEventListener('click', () => 
    window.open('https://google.com', 'meaningfulName')
)

这样，当您单击按钮例如 10 次时，浏览器将始终在一个新选项卡中重新呈现它，而不是在 10 个不同的选项卡中打开它，这会消耗更多的资源。

您可以在MDN 上阅读更多相关信息。

【讨论】：

【参考方案21】：

我研究了很多关于如何打开新标签并保持在同一个标签上的信息。我找到了一个小技巧来做到这一点。假设您有需要打开的网址 - newUrl 和旧网址 - currentUrl，您需要在打开新标签后继续使用它们。 JS 代码如下所示：

// init urls
let newUrl = 'http://example.com';
let currentUrl = window.location.href;
// open window with url of current page, you will be automatically moved 
// by browser to a new opened tab. It will look like your page is reloaded
// and you will stay on same page but with new page opened
window.open(currentUrl , '_blank');
// on your current tab will be opened new url
location.href = newUrl;

【讨论】：

问题是当用户的偏好是在新窗口中打开它们时打开一个新选项卡。它不是询问如何在新标签页中打开一个 URL，同时在现有标签页中打开另一个 URL。如果安装了广告拦截器，这将不起作用。当前标签将被广告拦截器关闭。【参考方案22】：

如何创建一个<a>，其中_blank 为target 属性值，url 为href，样式为 display:hidden 并带有一个子元素？然后添加到 DOM 中，然后在子元素上触发 click 事件。

更新

这行不通。浏览器会阻止默认行为。它可以通过编程方式触发，但不遵循默认行为。

自己检查看看：http://jsfiddle.net/4S4ET/

【讨论】：

【参考方案23】：

这可能是个 hack，但在 Firefox 中，如果您指定第三个参数“fullscreen=yes”，它会打开一个全新的窗口。

例如，

<a href="#" onclick="window.open('MyPDF.pdf', '_blank', 'fullscreen=yes'); return false;">MyPDF</a>

它似乎实际上覆盖了浏览器设置。

【讨论】：

【参考方案24】：

window.open(url) 将在新的浏览器选项卡中打开 url。下面是它的 JS 替代品

let a= document.createElement('a');
a.target= '_blank';
a.href= 'https://support.wwf.org.uk/';
a.click(); // we don't need to remove 'a' from DOM because we not add it

这里正在工作example（*** sn-ps 不允许打开新标签）

【讨论】：

"window.open(url) 将在新浏览器选项卡中打开 url" — 它将遵循用户对新窗口或新选项卡的偏好。当首选项是窗口时，它不会强制使用新选项卡。（这就是问题所在）。这同样适用于 target=_blank。您建议的这两种方法在之前关于此问题的 56 个未删除答案中都被多次提及（和批评）。【参考方案25】：

有很多答案副本建议使用“_blank”作为目标，但是我发现这不起作用。正如 Prakash 所说，这取决于浏览器。但是，您可以向浏览器提出某些建议，例如窗口是否应该有地址栏。

如果您提出足够的“类似标签的东西”，您可能会得到一个标签，as per Nico's answer to this more specific question for chrome ：

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

免责声明：这不是灵丹妙药。它仍然取决于用户和浏览器。现在，至少您已经为您希望窗口的外观指定了另一种偏好。

【讨论】：

【参考方案26】：

在 Firefox (Mozilla) 扩展中打开一个新标签页如下：

gBrowser.selectedTab = gBrowser.addTab("http://example.com");

【讨论】：

【参考方案27】：

这种方式与上述方案类似，但实现方式不同

.social_icon -> 一些带有 CSS 的类

 <div class="social_icon" id="SOME_ID" data-url="SOME_URL"></div>


 $('.social_icon').click(function()

        var url = $(this).attr('data-url');
        var win = window.open(url, '_blank');  ///similar to above solution
        win.focus();
   );

【讨论】：

【参考方案28】：

这对我有用，只是阻止事件，将 url 添加到 <a> tag 然后触发 tag 上的点击事件。

Js
$('.myBtn').on('click', function(event) 
        event.preventDefault();
        $(this).attr('href',"http://someurl.com");
        $(this).trigger('click');
);
HTML
<a href="#" class="myBtn" target="_blank">Go</a>

【讨论】：

这可能会在新选项卡或新窗口中打开，具体取决于浏览器设置。这个问题特别是关于在新标签页中打开，即使首选项是针对新窗口的。【参考方案29】：

我将在一定程度上同意以下人的观点（此处转述）：“对于现有网页中的链接，如果新页面是同一页面的一部分，浏览器将始终在新标签页中打开该链接网站作为现有网页。”至少对我来说，这个“一般规则”适用于 Chrome、Firefox、Opera、IE、Safari、SeaMonkey 和 Konqueror。

无论如何，有一种不太复杂的方法可以利用其他人提供的信息。假设我们正在谈论您自己的网站（下面的“thissite.com”），您想要控制浏览器的功能，那么，下面，您希望“specialpage.htm”为空，其中根本没有 HTML（节省从服务器发送数据的时间！）。

 var wnd, URL;  //global variables

 //specifying "_blank" in window.open() is SUPPOSED to keep the new page from replacing the existing page
 wnd = window.open("http://www.thissite.com/specialpage.htm", "_blank"); //get reference to just-opened page
 //if the "general rule" above is true, a new tab should have been opened.
 URL = "http://www.someothersite.com/desiredpage.htm";  //ultimate destination
 setTimeout(gotoURL(),200);  //wait 1/5 of a second; give browser time to create tab/window for empty page


 function gotoURL()
  wnd.open(URL, "_self");  //replace the blank page, in the tab, with the desired page
   wnd.focus();             //when browser not set to automatically show newly-opened page, this MAY work

【讨论】：

【参考方案30】：

如果你只想打开外部链接（指向其他网站的链接），那么这段 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');
        
    );
);

【讨论】：

这个回答不适合这个问题。但是，这是非常有用的想法！谢谢你的想法！

在新选项卡（而不是新窗口）中打开 URL

】在新选项卡（而不是新窗口）中打开URL【英文标题】：OpenaURLinanewtab(andnotanewwindow)【发布时间】：2011-06-2122:13:27【问题描述】：我正在尝试在新标签中打开URL，而不是弹出窗口。我已经看到相关问题的回复类似于：window.open(url,... 查看详情

Javascript 在新选项卡（而不是窗口）中打开 URL

】Javascript在新选项卡（而不是窗口）中打开URL【英文标题】：JavascripttoopenURLwithinanewTab(insteadofawindow)【发布时间】：2011-03-1709:01:45【问题描述】：大家好。这里有一些条目需要解决方案来做与此相反的事情，而其他一些则模糊相... 查看详情

JavaScript 在新窗口中打开，而不是选项卡

】JavaScript在新窗口中打开，而不是选项卡【英文标题】：JavaScriptopeninanewwindow,nottab【发布时间】：2010-10-1803:01:29【问题描述】：我有一个选择框，当一个项目被选中时调用window.open(url)。默认情况下，Firefox将在新选项卡中打开该... 查看详情

如何在新选项卡（而不是新窗口）中打开链接？ [复制]

】如何在新选项卡（而不是新窗口）中打开链接？[复制]【英文标题】：HowcanIopenalinkinnewtab(andnotnewwindow)?[duplicate]【发布时间】：2011-09-1120:47:54【问题描述】：我有一个“打开”按钮，用于“计算”应在新标签页中打开的链接。... 查看详情

使用“nofollow/赞助”时，window.open 在新窗口而不是新选项卡中打开

】使用“nofollow/赞助”时，window.open在新窗口而不是新选项卡中打开【英文标题】：window.openopensinnewwindowinsteadofnewtabwhenusing"nofollow/sponsored"【发布时间】：2021-08-2209:55:21【问题描述】：我有一个window.open链接，预计会打开... 查看详情

如何将表单提交到页面，以便此新页面在新窗口（而不是新选项卡）中打开？ [复制]

】如何将表单提交到页面，以便此新页面在新窗口（而不是新选项卡）中打开？[复制]【英文标题】：Howtosubmitaformtoapagesuchthatthisnewpageopensinanewwindow(ratherthananewtab)?[duplicate]【发布时间】：2017-05-1018:30:02【问题描述】：这是thisquesti... 查看详情

当用户选择“在新选项卡中打开”/“在新窗口中打开”而不是使用 html/javascript 点击时如何到达所需的页面

】当用户选择“在新选项卡中打开”/“在新窗口中打开”而不是使用html/javascript点击时如何到达所需的页面【英文标题】：Howtohavedesiredpagereachedwhenauserselects"OpeninNewTab"/"OpeninNewWindow"ratherthanclickswithhtml/javascript【发... 查看详情

我可以在 A 标签上添加一个属性来获取在新选项卡而不是同一窗口中打开的链接吗？

】我可以在A标签上添加一个属性来获取在新选项卡而不是同一窗口中打开的链接吗？【英文标题】：IsthereanattributeIcanputontheAtagtogetlinkstoopeninnewtabsinsteadofthesamewindow?【发布时间】：2010-10-2704:14:12【问题描述】：我知道target="_blank"... 查看详情

如何在新选项卡或窗口中打开 PDF 文件而不是下载它（使用 asp.net）？

】如何在新选项卡或窗口中打开PDF文件而不是下载它（使用asp.net）？【英文标题】：HowtoopenPDFfileinanewtaborwindowinsteadofdownloadingit(usingasp.net)?【发布时间】：2012-01-0719:21:39【问题描述】：这是下载文件的代码。System.IO.FileStreamfs=newSy... 查看详情

FullCalendar：在新选项卡/窗口中打开 gcal 事件

】FullCalendar：在新选项卡/窗口中打开gcal事件【英文标题】：FullCalendar:Opengcaleventinnewtab/window【发布时间】：2013-11-0117:10:03【问题描述】：在将Google日历输入FullCalendar时，是否有可能当用户点击FullCalendar中的事件时，该事件会在... 查看详情

在新选项卡/窗口中打开页面并将当前窗口定向到新 url

】在新选项卡/窗口中打开页面并将当前窗口定向到新url【英文标题】：Openpageinnewtab/windowANDdirectcurrentwindowtoanewurl【发布时间】：2015-07-2607:28:06【问题描述】：我已将表单操作设置为“_blank”，以便我正在创建的pdf文档在新选项... 查看详情

在新选项卡/窗口中打开链接而不丢失当前 JSF 页面的视图范围

】在新选项卡/窗口中打开链接而不丢失当前JSF页面的视图范围【英文标题】：Openalinkinnewtab/windowwithoutloosingtheviewscopeofcurrentJSFpage【发布时间】：2014-02-1504:39:31【问题描述】：我需要在当前JSF页面（比如1.xhtml）的新选项卡中打开... 查看详情

window.open(url, windowname, opts) 在新选项卡中打开，而不是在 Firefox 中打开新窗口

】window.open(url,windowname,opts)在新选项卡中打开，而不是在Firefox中打开新窗口【英文标题】：window.open(url,windowname,opts)opensinnewtabinsteadofnewwindowinFirefox【发布时间】：2012-04-1422:57:06【问题描述】：好像（试试jsfiddle）window.open(\'http://w... 查看详情

使用 JavaScript 打开链接新窗口（不是选项卡）而不输入两次 URL？ [复制]

...时间】：2014-12-1705:05:07【问题描述】：可以使用以下方法在新窗口（不是标签）中打开链接：<ahref="print.html"onclick="window.ope 查看详情

我想在新选项卡而不是同一选项卡中打开此路由器链接[重复]

】我想在新选项卡而不是同一选项卡中打开此路由器链接[重复]【英文标题】：Iwanttoopenthisrouterlinkinanewtabinsteadofsametab[duplicate]【发布时间】：2021-02-2513:44:53【问题描述】：这是我的指向页面路由的函数.ts文件readmoreFunc(data:any)this.... 查看详情

Javascript - 在新选项卡中打开链接（相同窗口）

】Javascript-在新选项卡中打开链接（相同窗口）【英文标题】：Javascript-OpenLinkinNewTab(SAMEWINDOW)【发布时间】：2013-11-1122:07:54【问题描述】：我意识到对于这个主题已经有几个关于SO的问题，但它们似乎都已经很老了....只是想得到... 查看详情

在新选项卡/窗口中打开 href mailto 链接

】在新选项卡/窗口中打开hrefmailto链接【英文标题】：Openthehrefmailtolinkinnewtab/window【发布时间】：2012-01-2221:41:09【问题描述】：我有一张图片，点击它时，我想链接到一个邮箱：<aid="mailto"href="mailto:hfms@live.com.my"target="_newtab">&... 查看详情

如何根据登录成功在新窗口/选项卡或同一窗口/选项卡中打开页面？

】如何根据登录成功在新窗口/选项卡或同一窗口/选项卡中打开页面？【英文标题】：Howtoopenpageinnewwindow/taborinsamewindow/tabdependingonLoginsuccess?【发布时间】：2012-04-3021:08:59【问题描述】：我的登录页面是IFrame。如果用户成功登录，... 查看详情

正文

在新选项卡（而不是新窗口）中打开 URL

重要提示：

window.open 无法在所有浏览器的新选项卡中可靠地打开弹出窗口

演示

Internet Explorer (11)

测试页

Chrome 怎么样？它实现 window.open 与 Internet Explorer (11) 和 Firefox (29) 不同。

总结

补充阅读

新窗口

新标签

这个问题有答案，不是没有。

更新

在新选项卡（而不是新窗口）中打开 URL

Javascript 在新选项卡（而不是窗口）中打开 URL

JavaScript 在新窗口中打开，而不是选项卡

如何在新选项卡（而不是新窗口）中打开链接？ [复制]

使用“nofollow/赞助”时，window.open 在新窗口而不是新选项卡中打开

如何将表单提交到页面，以便此新页面在新窗口（而不是新选项卡）中打开？ [复制]

当用户选择“在新选项卡中打开”/“在新窗口中打开”而不是使用 html/javascript 点击时如何到达所需的页面

我可以在 A 标签上添加一个属性来获取在新选项卡而不是同一窗口中打开的链接吗？

如何在新选项卡或窗口中打开 PDF 文件而不是下载它（使用 asp.net）？

FullCalendar：在新选项卡/窗口中打开 gcal 事件

在新选项卡/窗口中打开页面并将当前窗口定向到新 url

在新选项卡/窗口中打开链接而不丢失当前 JSF 页面的视图范围

window.open(url, windowname, opts) 在新选项卡中打开，而不是在 Firefox 中打开新窗口

使用 JavaScript 打开链接新窗口（不是选项卡）而不输入两次 URL？ [复制]

我想在新选项卡而不是同一选项卡中打开此路由器链接[重复]

Javascript - 在新选项卡中打开链接（相同窗口）

在新选项卡/窗口中打开 href mailto 链接

如何根据登录成功在新窗口/选项卡或同一窗口/选项卡中打开页面？

`window.open` 无法在所有浏览器的新选项卡中可靠地打开弹出窗口

Chrome 怎么样？它实现 `window.open` 与 Internet Explorer (11) 和 Firefox (29) 不同。