Chrome、Javascript、window.open 在新标签页中打开

IT技术 javascript window.open
2021-01-29 14:38:36

在 chrome 中,这会在新选项卡中打开:

<button onclick="window.open('newpage.html', '_blank')" />

这会在新窗口中打开(但我也希望在新选项卡中打开:

<script language="javascript">
  window.open('newpage.html', '_blank');
</script>

这可行吗?

6个回答

你不能直接控制它,因为它是一个由 Internet Explorer 用户控制的选项。

使用具有不同窗口名称的 Window.open 打开页面将在新的浏览器窗口中打开,如弹出窗口,或者在新选项卡中打开,如果用户将浏览器配置为这样做。

编辑:

更详细的解释:

1.在现代浏览器中,window.open 将在新选项卡中打开而不是弹出窗口。

2.您可以通过在第三个参数中指定选项来强制浏览器使用新窗口('popup')

3.如果 window.open 调用不是用户启动事件的一部分,它将在新窗口中打开。

4. “用户发起的事件”不一定是相同的函数调用——但它必须起源于用户点击调用的函数

5.如果用户发起的事件委托或推迟了函数调用(在未绑定到单击事件的事件侦听器或委托中,或例如使用 setTimeout),它会失去“用户发起”的状态

6.一些弹出窗口阻止程序将允许从用户启动的事件中打开窗口,但不允许以其他方式打开的窗口。

7.如果任何弹出窗口被阻止,那些通常被阻止者(通过用户启动的事件)允许的弹出窗口有时也会被阻止。一些例子…

强制在新浏览器实例中打开窗口,而不是在新选项卡中打开:

window.open('page.php', '', 'width=1000');

即使它调用另一个函数,以下内容也符合用户发起的事件的条件:

function o(){
  window.open('page.php');
}
$('button').addEvent('click', o);

以下不符合用户发起的事件,因为 setTimeout 推迟它:

function g(){
  setTimeout(o, 1);
}
function o(){
  window.open('page.php');
}
$('button').addEvent('click', g);
“如果 window.open 调用不是用户启动事件的一部分,它将在新窗口中打开。” 不,它几乎肯定不会被打开。
2021-03-25 14:38:36
我只想通过在 Chrome 和 FF 中进行测试来补充一点,我发现在您定义为“用户启动的事件”中使用 window.open 会保持浏览器的默认操作。我的意思是,如果在 Chrome 中按住 chrome 上的 shift 并单击,则会出现一个新的浏览器窗口,如果按住 ctrl(或按鼠标中键),则会在后台打开一个新选项卡。这非常好,您可以制作一些东西而无需到处放置锚标签。
2021-04-08 14:38:36
截至 2014 年 9 月 29 日,最新的 Firefox ESR 和 IE 11 在 js 调用使用 _blank 作为窗口名称时在新窗口中打开 _blank 或 window.open 链接。当前的 Chrome 并没有那么简单。我测试通过顶部、左侧、宽度、高度、工具栏、位置、目录、状态、菜单栏、滚动条和可调整大小打开一个新窗口,并依次省略每一个。除了省略状态、菜单栏或滚动条时,Chrome 会在新选项卡中将它们全部打开。这看起来如此武断,令人难以置信,但从经验上看,这就是发生的事情。此处示例:jsbin.com/mobiyeqojaha/1
2021-04-10 14:38:36

如果用户喜欢,强制使用选项卡有时很有用。正如上面的 Prakash 所说,这有时是由使用非用户启动的事件决定的,但有一些方法可以解决这个问题。

例如:

$("#theButton").button().click( function(event) {
   $.post( url, data )
   .always( function( response ) {
      window.open( newurl + response, '_blank' );
   } );
} );

将始终在新的浏览器窗口中打开“newurl”,因为“始终”功能不被视为用户启动的。但是,如果我们这样做:

$("#theButton").button().click( function(event) {
   var newtab = window.open( '', '_blank' );
   $.post( url, data )
   .always( function( response ) {
      newtab.location = newurl + response;
   } );
} );

我们打开新的浏览器窗口或创建新选项卡,这取决于用户启动的按钮单击中的用户首选项。然后我们只需在从 AJAX 帖子返回后将位置设置为所需的 URL。瞧,如果用户喜欢,我们会强制使用选项卡。

这是一个不错的解决方法,除非您的 window.open 和函数的结果需要 5/6/7 秒左右。考虑该函数是否将数据发布到生成 PDF 的服务器,这需要 10 秒。window.open 到一个空白选项卡是立即的,用户盯着空白选项卡 10 秒钟,直到它神奇地被填充。仍然在 iOS 上,它是唯一的解决方案。
2021-03-14 14:38:36
我注意到如果你在 window.open 上的 chrome 中设置了一个断点,那么浏览器会打开一个新窗口。让代码不中断似乎会导致打开一个新选项卡。
2021-04-06 14:38:36

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

试试这个,

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

为这个http://jsfiddle.net/safeeronline/70kdacL4/2/工作 js 小提琴

为 ajax 窗口打开工作 js 小提琴http://jsfiddle.net/safeeronline/70kdacL4/1/

目前(Chrome 39)我使用此代码打开一个新标签:

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

当然,这可能会在未来版本的 Chrome 中改变。

如果您无法控制用户使用的浏览器,那么使用它是一个坏主意。它可能不适用于未来版本或不同的设置。

我同意您的看法,如果您无法控制您的环境,那么依赖这样的解决方案是一个坏主意。但是在某些情况下这是可能的(例如,我在带有自己的便携式 Chrome 的应用程序中使用它)。为了说明这一点,我编辑了我的分析器。
2021-03-21 14:38:36
对于那些想知道的人,由于此错误,运行此代码片段不起作用: VM646 js:12 Blocked opening 'http://www.stackoverflow.com/' in a new window because the request was made in a sandboxed frame whose 'allow-popups' permission is not set.
2021-04-03 14:38:36
根据 jfriend00 的评论,用户配置浏览器的方式决定了新窗口的打开方式,而不是代码。
2021-04-11 14:38:36

这将在 Chrome 和 Firefox 的新标签页中打开链接,可能还有更多我没有测试过的浏览器:

var popup  = $window.open("about:blank", "_blank"); // the about:blank is to please Chrome, and _blank to please Firefox
popup.location = 'newpage.html';

它基本上打开一个新的空选项卡,然后设置该空选项卡的位置。请注意,这是一种黑客行为,因为浏览器选项卡/窗口行为实际上是浏览器和用户的域、责任和选择。

第二行可以在回调中调用(例如,在您完成一些 AJAX 请求之后),但是浏览器不会将其识别为用户启动的点击事件,并且可能会阻止弹出窗口。

$window只是 AngularJS 使用window. 您可以简单地使用window更多信息:docs.angularjs.org/api/ng/service/$window
2021-03-17 14:38:36