函数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();
    }
  }
}

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

相关文章

  • 在TypeScript中迭代对象键Object.keys不起作用的原因和解决方案

    在TypeScript中迭代对象键Object.keys不起作用的原因和解决方案

    在TypeScript中迭代对象键object keys可能是一场噩梦,以下是我所知道的所有解决方案,文中有详细的代码示例供大家参考,具有一定的参考价值,需要的朋友可以参考下
    2023-10-10
  • JavaScript定义变量和变量优先级问题探讨

    JavaScript定义变量和变量优先级问题探讨

    这篇文章主要介绍了JavaScript定义变量和变量优先级的问题探讨,变量的定义还有这么讲究吗,不错,看完本文相信你会有一定的收获,需要的朋友可以参考下
    2014-10-10
  • Javascript作用域和作用域链原理解析

    Javascript作用域和作用域链原理解析

    这篇文章主要介绍了Javascript作用域和作用域链原理解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-03-03
  • JavaScript函数详解

    JavaScript函数详解

    本文由简入深,详细介绍了javascript的函数问题,非常的详尽,非常的实用,这里推荐给大家,是篇不可多得的文章
    2015-02-02
  • layer.open关闭父窗口 以及调用父页面的方法

    layer.open关闭父窗口 以及调用父页面的方法

    今天小编就为大家分享一篇layer.open关闭父窗口 以及调用父页面的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-08-08
  • 重置Redux的状态数据的方法实现

    重置Redux的状态数据的方法实现

    这篇文章主要介绍了重置Redux的状态数据的方法实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-11-11
  • JS前端的内存处理的方法全面详解

    JS前端的内存处理的方法全面详解

    这篇文章主要为大家介绍了JS前端的内存处理的方法全面详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-04-04
  • ES6学习教程之模板字符串详解

    ES6学习教程之模板字符串详解

    大家都知道在ES6中引进的一种新型的字符串字面量语法-模板字符串,下面这篇文章主要给大家介绍了关于ES6学习教程之模板字符串的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
    2017-10-10
  • JS 判断undefined的实现代码

    JS 判断undefined的实现代码

    JS中如何判断undefined
    2009-11-11
  • js 毫秒转天时分秒的实例

    js 毫秒转天时分秒的实例

    下面小编就为大家分享一篇js 毫秒转天时分秒的实例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2017-11-11

最新评论