十年专注于品牌网站建设 十年专注于品牌网站建设,低调、有情怀的网络应用服务商!
南昌百恒网络微信公众号 扫一扫关注
小程序
tel-icon全国服务热线:400-680-9298,0791-88117053
扫一扫关注百恒网络微信公众号
扫一扫打开百恒网络微信小程序

百恒网络

南昌百恒网络

弹出窗口window.open()使用方法及相关参数介绍

百恒网络 2013-05-02 5618

使用window.open()方法既可以导航到一个特定的URL,也可以打开一个新的浏览器窗口。这个方法可以接收4个参数:要加载的URL、窗口目标、一个特性字符串以及一个表示新页面是否取代浏览器历史记录中当前加载页面的布尔值。通常只须传递第一个参数,最后一个参数只在不打开新窗口的情况下使用。

如果为window.open()传递了第二个参数,而且该参数是已有窗口或框架的名称,那么就会在具有该名称的窗口或框架中加载第一个参数指定的URL。看下面的例子:

//等同于

window.open("http://www.jxbh.cn/", topFrame");

调用这行代码,就如同用户单击了href属性为http://www.jxbh.cn/,target属性为"topFrame"的链接。如果有一个名叫"topFrame"的窗口或者框架,就会在该窗口或框架加载这个URL;否则,就会创建一个新窗口并将其命名为"topFrame"。此外,第二个参数也可以是下列任何一个特殊的窗口名称:_self、_parent、_top或blank。

弹出窗口

如果给window.open()传递的第二个参数并不是一个已经存在的窗口或框架,那么该方法就会根据在第三个参数位置上传人的字符串创建一个新窗口或新标签页。如果没有传入第三个参数,那么就会打开一个带有全部默认设置(工具栏、地址栏和状态栏等)的新浏览器窗口(或者打开一个新标签页——根据浏览器设置)。在不打开新窗口的情况下,会忽略第三个参数。

第三个参数是一个逗号分隔的设置字符串,表示在新窗口中都显示哪些特性。下表列出了可以出现在这个字符串中的设置选项。

fullscreen yes或no表示浏览器是否最大化.仅I限E.

height 数值表示新窗口的高度,不能小于100.

left 数值表示新窗口的左坐标,不能是负值

location  yes或no  表示是否在浏览器窗口中显示地址栏,不同浏览器的默认值不同.

menuber  yes或no  表示是否在浏览器窗口中显示菜单栏,默认值为no.

resizable  yes或no  表示是否可以通过拖动浏览器窗口的边框改变其大小,默认值为no

scrollbars  yes或no  表示如果内容在视口中显示不下,是否允许滚动.默认值为no

status  yes或no  表示是否在浏览器窗口中显示状态栏,默认值为no

toolbar  yes或no  表示是否在浏览器窗口中显示工具栏。默认值为no

top  数值  表示新窗口的上坐标。不能是负值

width  数值  表示新窗口的宽度。不能小于100

表中所列的部分或全部设置选项,都可以通过逗号分隔的名值对列表来指定。其中,名值对以等号表示(注意,整个特性字符串中不允许出现空格),如下面的例子所示:

window.open("http://www.jxbh.cn/","jxbhWindow", "height=400, width=400,top=10, left=10, resizable=yes");

这行代码会打开一个新的可以调整大小的窗口,窗口初始大小为400×400像素,并且距屏幕上沿和左边各10像素。

window.open()方法会返回一个指向新窗口的引用。引用的对象与其他window对象大致相似, 但我们可以对其进行更多控制。南昌网站设计公司工程师多年的工作经验总结,有些浏览器在默认情况下可能不允许我们针对主浏览器窗口调整大小或移动位置,但却允许我们针对通过window.open()创建的窗口调整大小或移动位置。通过这个返回的对象,可以像操作其他窗口一样操作新打开的窗口,如下所示:

var jxbhWin=window.open("http://www.jxbh.cn/","jxbhWindow", "height=400, width=400, top=10, left=10, resizable=yes");

//调整大小

jxbhWin.resizeTo( 500, 00);

//移动位置

jxbhWin .moveTo (100,100);

调用close()方法还可以关闭新打开的窗口:

jxbhWin.close();

但是,这个方法仅适用于通过window.open()打开的弹出窗口。南昌建网站公司技术人员认为,对于浏览器的主窗口,如果没有得到用户的允许是不能关闭它的。不过,弹出窗口倒是可以调用top.close()在不经用户允许的情况下关闭自己。弹出窗口关闭之后,窗口的引用仍然还在,但除了像下面这样检测其closed属性之外,已经没有其他用处了:

jxbhWin.close();

alert (jxbhWin.closed); //true

新创建的window对象有一个opener属性,其中保存着打开它的原始窗口对象。这个属性只在弹 出窗口中的最外层window对象(top)中有定义,而且指向调用window.open()的窗口或框架。例如:

var jxbhWin=window.open("http://www.jxbh.cn/","jxbhWindow", "height=400, width=400, top=10, left=10, resizable=yes");

虽然弹出窗口中有一个指针指向打开它的原始窗口,但原始窗口中并没有这样的指针指向弹出窗口。窗口并不跟踪记录它们打开的弹出窗口,南昌网络公司技术员提示,因此我们只能在必要的时候自己来手动实现跟踪。

有些浏览器(如IE8和Chrome)会在独立的进程中运行每个标签页。当一个标签页打开另一个标签页时,如果两个window对象之间需要彼此通信,那么新标签页就不能运行在独立的进程中。在Chrome中,将新创建的标签页的opener属性设置为null,即表示在单独的进程中运行新标签页,如下所示:

var jxbhWin=window.open("http://www.jxbh.cn/","jxbhWindow", "height=400,width=400,top=10, left=10, resizable=yes");

将opener属性设置为null就是告诉浏览器新创建的标签页不需要与打开它的标签页通信,因此可以在独立的进程中运行。标签页之间的联系一旦切断,将没有办法恢复。

本文仅限内部技术人员学习交流,不得作于其他商业用途.文章出自:南昌网站建设公司-百恒网络 http://www.jxbh.cn 如转载请注明出处!


400-680-9298,0791-88117053
扫一扫关注百恒网络微信公众号
扫一扫打开百恒网络小程序

欢迎您的光顾,我们将竭诚为您服务×

售前咨询 售前咨询
 
售前咨询 售前咨询
 
售前咨询 售前咨询
 
售前咨询 售前咨询
 
售前咨询 售前咨询
 
售后服务 售后服务
 
售后服务 售后服务
 
备案专线 备案专线
 
×