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

 更新时间:2015年08月03日 15:46:17   作者:FS1360472174  
这篇文章主要介绍了函数window.open实现关闭所有的子窗口的相关资料,需要的朋友可以参考下。

此文介绍了如何用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();
    }
  }
}

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

相关文章

  • GoJs中标题和缩略图使用技巧

    GoJs中标题和缩略图使用技巧

    这篇文章主要为大家介绍了GoJs中标题和缩略图使用技巧详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-05-05
  • js 获取经纬度的实现方法

    js 获取经纬度的实现方法

    下面小编就为大家带来一篇js 获取经纬度的实现方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • js实现固定宽高滑动轮播图效果

    js实现固定宽高滑动轮播图效果

    本文主要分享了js实现PC固定宽高滑动轮播图效果的示例代码。具有一定的参考价值,下面跟着小编一起来看下吧
    2017-01-01
  • js贪吃蛇游戏实现思路和源码

    js贪吃蛇游戏实现思路和源码

    这篇文章主要为大家介绍了js贪吃蛇游戏实现思路,并分享贪吃蛇游戏源码,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-04-04
  • 微信小程序获取位置展示地图并标注信息的实例代码

    微信小程序获取位置展示地图并标注信息的实例代码

    这篇文章主要介绍了微信小程序获取位置展示地图并标注信息的实例代码,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-09-09
  • javascript foreach中如何获取数组下标/index

    javascript foreach中如何获取数组下标/index

    这篇文章主要介绍了javascript foreach中如何获取数组下标/index问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-07-07
  • TypeScript泛型的使用详细介绍

    TypeScript泛型的使用详细介绍

    在TypeScript中,泛型是一种创建可复用代码组件的工具。这种组件不只能被一种类型使用,而是能被多种类型复用。类似于参数的作用,泛型是一种用以增强类(classes)、类型(types)和接口(interfaces)能力的非常可靠的手段
    2022-09-09
  • JS日期格式化之javascript Date format

    JS日期格式化之javascript Date format

    这篇文章主要介绍了JS日期格式化之javascript Date format的相关资料,需要的朋友可以参考下
    2015-10-10
  • javascript 新闻列表排序简单封装

    javascript 新闻列表排序简单封装

    可以控制列表按日期以及按字数排序.升或者降序.代码简单封装,按一定的格式调用即可。
    2009-11-11
  • JS数组reduce你不得不知道的25个高级用法

    JS数组reduce你不得不知道的25个高级用法

    reduce作为ES5新增的常规数组方法之一,对比forEach 、filter和map,在实际使用上好像有些被忽略,下面这篇文章主要给大家介绍了关于JS数组reduce你不得不知道的25个高级用法,需要的朋友可以参考下
    2021-06-06

最新评论