点击小箭头阅读更舒适 如果觉得卡顿,请点击小眼睛关闭蜘蛛网特效

JavaScript之打开和关闭窗口(open/close解析)

《JavaScript之打开和关闭窗口(open/close解析)》

1.使用window对象的open()方法可以打开一个新窗口。用法如下:

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

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

myWindow=window.open();  //打开新的空白窗口
myWindow.document.write("<h1>这是新打开的窗口</h1>");  //在新窗口输出提示信息
myWindow.focus();  //让原窗口获得焦点
myWindow.opener.document.write("<h1>这是原来的窗口</h1>");  //在原窗口输出提示信息
alert(myWindow.opener==window);  //检测window.opener的属性值

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

在Chrome中将新建的标签页的opener属性设置为null,即表示在单独的进程中运行新标签页,代码如下:

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

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

2.使用window对象的close()方法可以关闭一个窗口。比如下面的例子显示了自动弹出一个窗口,然后设置30秒之后自动关闭此窗口,同时允许用户单击页面超链接,更换弹出窗口内显示的网页URL:

var url="https://oldpan.me/";
var features="height=500,width=800,top=100,left=100,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=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);

很多浏览器会禁止JavaScript弹出窗口,这个时候使用open()方法会抛出一个异常,需要用代码探测一下。

《JavaScript之打开和关闭窗口(open/close解析)》

  点赞
本篇文章采用 知识共享署名-相同方式共享 4.0 国际许可协议 进行许可
转载请务必注明来源: https://oldpan.me/archives/js-open-close-handle

   欢迎关注Oldpan博客微信公众号,同步更新博客深度学习文章。


发表评论

电子邮件地址不会被公开。 必填项已用*标注

评论审核已启用。您的评论可能需要一段时间后才能被显示。