函数window.open实现关闭所有的子窗口


Posted in Javascript onAugust 03, 2015

此文介绍了如何用window.open方法打开一个子窗口,当我们要关闭主窗口时,这时候所有的子窗口也会跟着关闭。下面有我的实现思路和代码,分享给大家。

实现思路:
1.打开子窗口函数window.open(url,winName)的第二个参数winName可以唯一标识打开的窗口。因此关闭子窗口只需要使用winName.close()函数即可。
2.一个页面可能有多个子窗口。因此需要一个数组存储所有子窗口对象。关闭时,遍历数组即可。
3.子窗口还可以再打开子窗口。无限循环下去。因此需要判断。
此需求可以通过两个方法实现。

调用子窗口的关闭函数。
此方法易于理解,但是实际实现过程中发现浏览器的关闭事件并没有。且需要是按钮点击关闭还是快捷键关闭,稍微麻烦一些、递归关闭子窗口
此方法实现简单,缺点就是所有的窗口存储子窗口的对象数组需同名

下面是使用递归关闭子窗口及子窗口的子窗口方法

function closeSonWindow(win){
  for(var index=0;index<win.length;index++){
    //如果窗口已关闭
    if(win[index].closed){
      continue;
    }
    //如果窗口没有可以打开的子窗口
    if(typeof(win[index].openedWindow)=="undefined"){
      win[index].close();
      continue;
    }
    if(win[index].openedWindow.length==0){
      win[index].close();
    }else{
      closeSonWindow(win[index].openedWindow);
      win[index].close();
    }
  }
}

以上就是本文的全部叙述,希望对大家有所帮助。

Javascript 相关文章推荐
Display SQL Server Login Mode
Jun 21 Javascript
本地对象Array的原型扩展实现代码
Dec 04 Javascript
node.js中的fs.fchownSync方法使用说明
Dec 16 Javascript
javascript瀑布流式图片懒加载实例解析与优化
Feb 23 Javascript
AngularJS 模块详解及简单实例
Jul 28 Javascript
ionic组件ion-tabs选项卡切换效果实例
Aug 27 Javascript
vue实现留言板todolist功能
Aug 16 Javascript
详解vue挂载到dom上会发生什么
Jan 20 Javascript
微信小程序如何获取群聊的openGid以及名称详解
Jul 17 Javascript
electron实现静默打印的示例代码
Aug 12 Javascript
解决新建一个vue项目过程中遇到的问题
Oct 22 Javascript
Vue3如何理解ref toRef和toRefs的区别
Feb 18 Vue.js
百度地图api如何使用
Aug 03 #Javascript
javascript实现输出指定行数正方形图案的方法
Aug 03 #Javascript
如何用js 实现依赖注入的思想,后端框架思想搬到前端来
Aug 03 #Javascript
javascript常见数据验证插件大全
Aug 03 #Javascript
javascript自定义in_array()函数实现方法
Aug 03 #Javascript
JavaScript简单修改窗口大小的方法
Aug 03 #Javascript
javascript实现随机读取数组的方法
Aug 03 #Javascript
You might like
php mssql 分页SQL语句优化 持续影响
2009/04/26 PHP
php针对cookie操作的队列操作类实例
2014/12/10 PHP
php array_merge函数使用需要注意的一个问题
2015/03/30 PHP
php注册登录系统简化版
2020/12/28 PHP
Add a Picture to a Microsoft Word Document
2007/06/15 Javascript
JQuery 实现的页面滚动时浮动窗口控件
2009/07/10 Javascript
JS上传前预览图片实例
2013/03/25 Javascript
js日期相关函数总结分享
2013/10/15 Javascript
当鼠标移动时出现特效的JQuery代码
2013/11/08 Javascript
js控制input框只读实现示例
2014/01/20 Javascript
jQuery实现鼠标单击网页文字后在文本框显示的方法
2015/05/06 Javascript
js闭包所用的场合以及优缺点分析
2015/06/22 Javascript
JavaScript中数组继承的简单示例
2015/07/29 Javascript
jQuery插件EasyUI校验规则 validatebox验证框
2015/11/29 Javascript
微信小程序 教程之wxapp视图容器 scroll-view
2016/10/19 Javascript
利用Node.JS实现邮件发送功能
2016/10/21 Javascript
基于jQuery实现数字滚动效果
2017/01/16 Javascript
通过JS深度判断两个对象字段相同
2019/06/14 Javascript
JS+CSS实现动态时钟
2021/02/19 Javascript
[00:32]2018DOTA2亚洲邀请赛Liquid出场
2018/04/03 DOTA
Python实现发送email的几种常用方法
2014/08/18 Python
python实现文本去重且不打乱原本顺序
2016/01/26 Python
Python中with及contextlib的用法详解
2017/06/08 Python
Python实现的ftp服务器功能详解【附源码下载】
2019/06/26 Python
利用Pandas和Numpy按时间戳将数据以Groupby方式分组
2019/07/22 Python
python基于pdfminer库提取pdf文字代码实例
2019/08/15 Python
Python GUI编程学习笔记之tkinter界面布局显示详解
2020/03/30 Python
使用Python+Appuim 清理微信的方法
2021/01/26 Python
利用html5 canvas动态画饼状图的示例代码
2018/04/02 HTML / CSS
英国水族馆和池塘用品购物网站:Warehouse Aquatics
2019/08/29 全球购物
请说出几个常用的异常类
2013/01/08 面试题
办公室秘书自我鉴定
2014/01/18 职场文书
舞蹈比赛获奖感言
2014/02/04 职场文书
局机关干部群众路线个人对照检查材料思想汇报
2014/10/05 职场文书
学习心得体会
2019/06/20 职场文书
gojs实现蚂蚁线动画效果
2022/02/18 Javascript