雨夜 小知识百科站
您的位置:小知识百科站 » 投稿 » JavaScript 使用window对象 → 打开和关闭窗口:open() / close() 方法 » 正文

JavaScript 使用window对象 → 打开和关闭窗口:open() / close() 方法

投稿2023-12-19已被浏览0

关于《JavaScript 使用window对象 → 打开和关闭窗口:open() / close() 方法》,现在小知识百科站小编给您分享一下,希望您阅读完本篇内容后能有所收获。如果对您有所帮助别忘了关注本站哦。

JavaScript 使用window对象 → 打开和关闭窗口:open() / close() 方法

1、open() 方法

使用 window 对象的 open() 方法,可以打开一个新窗口,该方法的返回值为新建的 window 对象,使用这个 window 对象可以引用新建的窗口。用法如下:

window.open(URL,name,features,replace);
//参数说明如下:
//URL:可选字符串,声明在新窗口中显示文档的URL。如果忽略,或者为空,则新窗口就不会显示任何文档。
//name:可选字符床,声明新窗口的名称。这个名称可以做标记<a>和<form>的属性 target 的值。
//    如果该参数指定了一个已经存在的窗口,那么open()方法就不会再创建一个新窗口,而只是返回一个指定窗口的引用。
//    这种情况下,features 参数将被忽略。
//features:可选字符串,声明了新窗口要显示的标准浏览器的特征。如果忽略该参数,新窗口将具有所有标准特征
//replace:可选的布尔值,规定了装载到窗口的 URL 是在窗口的浏览历史中创建一个新项目,还是替换浏览器历史中的当前条目。

新窗口显示特征

window.open新窗口显示特征
特征说明
channelmode = yes | no | 1 | 0 是否使用剧院模式显示窗口。默认为no。
directories = yes | no | 1 | 0 是否添加目录按钮。默认为yes。
fullscreen = yes | no | 1 | 0 是否使用全屏模式显示浏览器。默认是no。处于全屏模式的窗口必须同时处于剧院模式。
height = pixels窗口文档显示区的高度。以像素计。
left = pixels窗口的x坐标。以像素计。
location = yes | no | 1 | 0 是否显示地址字段。默认是yes。
menubar = yes | no | 1 | 0 是否显示菜单栏。默认是yes。
resizable = yes | no | 1 | 0 窗口是否可调节尺寸。默认是yes。
scrollbars = yes | no | 1 | 0 是否显示滚动条。默认是yes。
status = yes | no | 1 | 0 是否添加状态栏。默认是yes。
titlebar = yes | no | 1 | 0 是否显示标题栏。默认是yes。
toolbar = yes | no | 1 | 0 是否显示浏览器的工具栏。默认是yes。
top = pixels窗口的y坐标。
width = pixels窗口的文档显示区的宽度。以像素计。

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

下面例子演示打开窗口和原窗口之间的关系。

myWindow = window.open();    //打开新的空白窗口
myWindow.document.write("<h1>这是新打开的窗口</h1>");    //在新的窗口中输出提示信息
myWindow.opener.document.write("<h1>这是原来的窗口</h1>");    //在原窗口中输出提示信息
alert(myWindow.opener == window);    //检测window.opener属性值,返回true

虽然弹出窗口由一个指针(opener)指向打开它的窗口,但是原始窗口中并没有这样的指针指向弹出窗口。窗口并不跟踪已打开的弹出窗口,因此必要时只能手动实现跟踪。

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

myWindow = window.open();
myWindow.opener = null;

将 opener 属性设置为 null,这样新建的标签页就无法余打开它的标签页通信。标签页之间的联系一旦切断,将无法恢复。

2、close() 方法

使用 window 对象的 close() 方法可以关闭一个窗口。例如:要关闭一个新建的 w 窗口,可以使用下面的方法来完成。

w.close();
//如果在打开窗口内部关闭自身窗口,则应该使用如下方法完成
window.close();

使用 window.closed 属性可以检测当前窗口是否关闭,如果关闭则返回 true,否则返回 false。

下面例子演示了如何自动弹出一个新窗口,然后设置一段时间之后自动关闭该窗口,同时允许用户单机页面超链接,更换弹出窗口内显示的网页 URL。

var url = "http://www.370300.com";
var features = "height=500,width=500,top=100,left=100,toolbar=no,menubar=no,scrollbars=no,resizable=no"
document.write('<a href="http://www.baidu.com/" target="newW">切换到百度首页</a>');
var me = window.open(url,"newW",features);
setTimeout(function(){
    if(me.closed){
        alert("创建的窗口已关闭");
    }else{
        me.close();
    }
},5000);    //延迟5000毫秒自动关闭

很多浏览器会禁用 JavaScript 弹出窗口,如果在浏览器禁止的情况下,使用 open() 方法打开新窗口,将会抛出一个异常,说明打开窗口失败。为了避免此类问题,同时为了了解浏览器是否支持禁用弹窗行为,可以使用如下代码检测。

var error = false;
try{
    var w = window.open("http://baidu.com/","_blank");
    if(w == null){
        error = true;
    }
}catch(ex){
    error = true
}
if(error){
    alert("浏览器禁用弹出窗口");
}

本文关键词:window.open,JavaScript,close,open,关闭,窗口,打开,对象,window,使用,方法。以上就是关于“JavaScript 使用window对象 → 打开和关闭窗口:open() / close() 方法”的所有内容,希望分享的内容对您有帮助!更多的相关知识内容,请继续关注《小知识百科站》网站:http://www.370300.com/!。

猜您喜欢

  • 奇异的闪电

    天空中积雨云强烈发展时,常常伴有雷鸣闪电发生。黑夜里,闪亮耀眼的闪光划破了漆黑的夜空,人们到见最多的闪电呈树枝状,但细心观测者的也记录到许多形状奇异的闪电,如串珠状闪电、火箭状闪电、球状闪电等,这里不...

    2023-12-08
  • 电信大圣卡看快手直播免流量吗

    电信大圣卡是不支持快手免流量的,电信大圣卡月费为19元,套餐内容包含1GB国内流量和100分钟国内通话,百度圣卡电信版支持百度系和网易系APP免流。百度系包括手机百度、爱奇艺、百度网盘、百度地图、百度...

    2023-12-06
  • 关于自己年龄大的感慨语录
    关于自己年龄大的感慨语录

    ①关于自己年龄大的感慨语录关于自己年龄大的感慨和语录:1、中年是对青年的延伸,又是对青年的告别。2、我不赞成太多地歌颂青年,而坚持认为那是一个充满陷阱的年代。陷阱一生都会遇到,但青年时代的陷阱最多、最...

    2023-12-06
  • 2023全国交通天气最新预报:12月16日高速路况最新实时查询

    据报道,据全国交通天气最新预报显示,预计从昨天开始一直到今天,新疆南疆西部山区、内蒙古东南部、东北地区中南部和东部、山东半岛、江南北部等地部分地区有小到中雪或雨夹雪,其中,吉林东部、山东半岛北部等地局...

    2023-12-16
  • 新朗逸油箱多少升

    1、新朗逸油箱是55升。2、朗逸是由上海大众生产一款轿车,2008年6月上市。在延续了A级车市“动感时尚”的设计语言的基础上,LAVIDA朗逸体现了一种全新的设计DNA——“融合”。3、作为上海大众推...

    2023-12-21
  • 保持室内空气流通有利身体健康

    适合的温、湿度是细菌、病毒等微生物生长繁殖的重要条件,而空气流动是调节温、湿度的有效措施。有人曾经做过测试,对一间10平方米的房间空气的各项数据进行化验,然后将门窗紧闭,让3个人在屋里看书,3小时后,...

    2023-12-08
  • 电子产品哪个网站好,黑五海淘什么网站好

    内容导航:1、电子产品哪个网站好,黑五海淘什么网站好2、网购电子产品的靠谱平台1、电子产品哪个网站好,黑五海淘什么网站好️黑五大促活动即将开启!不知道大家有没有想海淘的产品呢?对于电子产品发烧友来说,...

    2023-12-15
  • 炎夏,当心细菌性食物中毒

    在夏天,发生食物中毒主要以细菌性食物中毒为主,在各类食物中毒中,细菌性食物中毒最多见,占食物中毒总数的一半左右。细菌性食物中毒具有明显的季节性,多发生在气候炎热的季节。这是由于气温高,适合于微生物生长...

    2023-12-08
  • 海底捞牛肉粒为什么那么便宜,不差钱的海底捞是怎么被羊毛党给吃穷的
    海底捞牛肉粒为什么那么便宜,不差钱的海底捞是怎么被羊毛党给吃穷的

    关于【海底捞牛肉粒为什么那么便宜】,不差钱的海底捞是怎么被羊毛党给吃穷的,今天小知识百科站小编给您分享一下,如果对您有所帮助别忘了关注本站哦。内容导航:1、牛肉粒变素了?不差钱的海底捞是怎么被羊毛党给...

    2023-12-05
  • 什么字的右边是土字

    右边是土字的字有杜、牡、灶、社、吐、肚等。1、牡:可组词为牡丹、牡蛤、牡菊、牡荆、牝牡、牡飞、元牡、牡牝、牡蒿等。2、灶:可组词为病灶、灶炉、灶神、灶火等。3、杜:可组词为杜鹃、杜葵、杜陵、杜撰、杜若...

    2023-12-11