html从新的打开选项卡,关于html:链接打开一个新窗口(不是选项卡)

本问题已经有最佳答案,请猛点这里访问。

有没有一种方法可以使链接在不使用JavaScript的情况下打开新的浏览器窗口(而非标签页)?

这将打开一个新窗口,而不是选项卡(使用JavaScript,但相当简洁):

οnclick="window.open('print.html',

'newwindow',

'width=300,height=250');

return false;"

>Print

根据OP的"不使用javascript"的定义(此答案使用JS,但不包括任何JS文件或元素),多数情况下这是正确的答案。我建议添加href,它鼓励浏览器正确设置链接的样式:请参见此处:jsfiddle.net/tobek/GPg6t/1。 href应该指出您实际使用JS打开的链接,这可以使其在语义上保持正确,并且对于搜索引擎更易理解。 return false阻止浏览器实际转到该链接。

有什么方法可以用这种方法控制在新窗口打开的位置吗?它默认设置为左上角,而Id希望将其居中。 (这是针对Twitter的共享意图,而非垃圾邮件。)

@KyleClegg我认为您应该在window.open()调用中添加" top"和" left"属性,但是由您决定屏幕的大小。我不相信有一种自动的方式来居中一个新窗口。该链接可能会帮助:w3schools重新打开窗口

刚刚在三种浏览器上尝试过。适用于FF和Chrome,但不适用于IE 11。

刚刚在IE11中尝试过,效果很好。大量的代码!

为了使其可调整大小并具有滚动条,只需添加即可。...

facebook.com" onclick =" window.open(facebook.com,newwindow,width = 300,height = 250,resizable = yes,scrollbars = yes) ;返回false;"> Fb

在IE11和最新的Chrome 49中为我工作,干杯!谢谢

不错的工作对我有用

在IE11上对我不起作用(精确版本:11.0.9600.18837,更新版本:11.0.48)

您还可以仅使用href,并使用Print

另外,如果您不想重复链接,则可以使用:οnclick="window.open(this.href,newwindow,width=1000,height=800); return false;"这将使用元素的href

使用纯HTML不能影响这一点-每个现代的浏览器(=用户)都可以完全控制此行为,因为它过去曾被滥用很多。

HTML选项

您可以打开一个新窗口(HTML4)或一个新的浏览上下文(HTML5)。现代浏览器中的浏览上下文主要是"新标签",而不是"新窗口"。您对此没有任何影响,也无法"强制"现代浏览器打开新窗口。

为此,请使用锚元素的属性target [1]。您要查找的值是_blank [2]。

link text

JavaScript选项

可以通过javascript强制打开新窗口-有关javascript解决方案,请参见下面的Ievgen优秀答案。

(!)但是,请注意,通过javascript打开窗口(如果未通过锚元素在onclick事件中完成)会受到弹出窗口阻止程序的阻止!

[1]此属性可以追溯到浏览器没有选项卡并且使用框架集是最新技术的时代。同时,此属性的功能已稍有更改(请参见MDN Docu) sub>

[2]还有一些其他值不再有意义(因为它们是为框架集而设计的),例如_parent,_self或_top。 sub>

似乎在2015年无法使用。Safari 9.0

@StefanHuska我想我在回答中很清楚地解释了这一点:并希望使用正确的浏览器设置-如果将浏览器配置为在新选项卡中打开链接,那么从html角度来看,您无能为力。这与浏览器无关,无论是哪种情况,如今大多数现代浏览器都可以在新标签页中打开。您需要一个像Ievgens这样的javascript解决方案。

在谷歌浏览器和Firefox中不起作用(IE支持此功能)

@JeanGkol我重写了我的答案以澄清问题。从技术上讲,它是有效的,因为它打开了一个新的浏览上下文(如预期的那样)。问题是,在现代浏览器中,"浏览上下文"是一个选项卡,而不是一个窗口(不过您可以在设置中更改它)。

我知道它有点老Q,但是如果您通过搜索解决方案到达这里,那么我通过jquery得到了一个不错的解决方案

jQuery('a[target^="_new"]').click(function() {

var width = window.innerWidth * 0.66 ;

// define the height in

var height = width * window.innerHeight / window.innerWidth ;

// Ratio the hight to the width as the user screen ratio

window.open(this.href , 'newwindow', 'width=' + width + ', height=' + height + ', top=' + ((window.innerHeight - height) / 2) + ', left=' + ((window.innerWidth - width) / 2));

});

它将在新窗口中打开所有

编辑:

1,我对原始代码做了一些小的更改,现在它完全按照用户屏幕比例打开了新窗口(适用于横向桌面)

但是,我建议您使用以下代码(如果您使用移动设备,则在新标签页中打开链接)(感谢zvona回答其他问题):

jQuery('a[target^="_new"]').click(function() {

return openWindow(this.href);

}

function openWindow(url) {

if (window.innerWidth <= 640) {

// if width is smaller then 640px, create a temporary a elm that will open the link in new tab

var a = document.createElement('a');

a.setAttribute("href", url);

a.setAttribute("target","_blank");

var dispatch = document.createEvent("HTMLEvents");

dispatch.initEvent("click", true, true);

a.dispatchEvent(dispatch);

}

else {

var width = window.innerWidth * 0.66 ;

// define the height in

var height = width * window.innerHeight / window.innerWidth ;

// Ratio the hight to the width as the user screen ratio

window.open(url , 'newwindow', 'width=' + width + ', height=' + height + ', top=' + ((window.innerHeight - height) / 2) + ', left=' + ((window.innerWidth - width) / 2));

}

return false;

}

top=300, left=350谢谢您的支持! :)

OP请求"没有javascript",但jQuery基于javascript。

您说对了,但是要么没有其他解决方案,要么更优雅。它反映了文档的原始行为。如果您不希望使用JavaScript解决方案?您可以只使用Christoph答案中的_blank。

您可以尝试以下方法:

Link Text

您也可以尝试以下方法:

Link Text

浏览器控制了许多此功能,但

Go to Yahoo

将尝试在新窗口中打开yahoo.com。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值