js父窗口关闭时子窗口随之关闭完美解决方案


Posted in Javascript onApril 29, 2014

最近,遇到一个权限管理的系统。由于权限管理的系统和本来的系统风格不一致,所有新打开一个窗口。问题就来了,admin注销之后,权限管理的窗口没有关闭。其他普通用户登录以后,仍然可以操作权限管理的窗口。

问题简化:admin注销的时候,或者main.html关闭的时候,打开的所有新窗口一起关闭。问题就解决了

直接看代码吧:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<title>Insert title here</title> 
</head> 
<body onUnload="closeNews();"> <a href="#" onclick="openNew('http://www.baidu.com','nihao')">打开新窗口</a> 
<a href="#" onclick="logOut();">退出登录</a> 
</body> 
</html> 
<script> 
//用户记录所有打开的子窗口 
var win_Array = new Array(); 
var win_num = -1; 
//每次打开一个新窗口都记录下来 
function openNew(uri,param){ 
win_num = win_num+1; 
win_Array[win_num] = window.open(uri); 
} 
//用户注销的时候,执行关闭方法。body添加onUnload = "closeNews();" 当main窗口关闭时候,所有的子窗口关闭 
function closeNews(){ 
//关闭权限管理 
if(win_Array.length > 0){ 
for(var i = 0;i <= win_Array.length;i++){ 
var win_one = win_Array[i]; 
if(win_one != undefined){ 
win_one.close(); 
} 
} 
} 
} 
function logOut(){ 
//关闭子窗口 
closeNews(); 
//退出登录 
} 
</script>

说明一下:

<body onUnload="closeNews();">在body上添加onUnload事件很重要。即:当窗口关闭以后,执行关闭所有子窗口的方法。

测试:在web项目中,ie8,ie10,火狐,chrome,opera都没有问题。

一旦不放倒wen容器中,只是静态的 main.html页面的时候,ie有问题,因为静态的时候,ie的window.open()居然是打开新页面,不是打开新标签。所有关闭窗口的方法不再有效。

时间有限,还没有花精力去细究,还望知道为什么的js技术大神 可以指导一下。再次致谢。

Javascript 相关文章推荐
基于jQuery替换table中的内容并显示进度条的代码
Aug 02 Javascript
使用Jquery实现点击文字后变成文本框且可修改
Sep 21 Javascript
原生JS实现仿淘宝网左侧商品分类菜单效果代码
Sep 10 Javascript
详细谈谈AngularJS的子级作用域问题
Sep 05 Javascript
使用JavaScript获取Request中参数的值方法
Sep 27 Javascript
JavaScript之iterable_动力节点Java学院整理
Jun 29 Javascript
聊聊那些使用前端Javascript实现的机器学习类库
Sep 18 Javascript
vue2.0 + element UI 中 el-table 数据导出Excel的方法
Mar 02 Javascript
详解如何使用koa实现socket.io官网的例子
Nov 04 Javascript
如何在项目中使用log4.js的方法步骤
Jul 16 Javascript
JS实现的进制转换,浮点数相加,数字判断操作示例
Nov 09 Javascript
JS 数组基本用法入门示例解析
Jan 16 Javascript
JS截取url中问号后面参数的值信息
Apr 29 #Javascript
javascript类型转换示例
Apr 29 #Javascript
常见浏览器多长时间会提示“脚本运行时间过长”总结
Apr 29 #Javascript
javascript中使用正则计算中文长度的例子
Apr 29 #Javascript
一个简单的Node.js异步操作管理器分享
Apr 29 #Javascript
IE浏览器中图片onload事件无效的解决方法
Apr 29 #Javascript
javascript的创建多行字符串的7种方法
Apr 29 #Javascript
You might like
PHP echo,print,printf,sprintf函数之间的区别与用法详解
2013/11/27 PHP
PHP抓屏函数实现屏幕快照代码分享
2014/01/02 PHP
浅谈javascript 面向对象编程
2009/10/28 Javascript
讨论javascript(一)工厂方式 js面象对象的定义方法
2009/12/15 Javascript
JavaScript去掉空格的方法集合
2010/12/28 Javascript
JavaScript高级程序设计(第3版)学习笔记11 内建js对象
2012/10/11 Javascript
jtable列中自定义button示例代码
2013/11/21 Javascript
js闭包引起的事件注册问题介绍
2016/03/29 Javascript
javascript面向对象程序设计高级特性经典教程(值得收藏)
2016/05/19 Javascript
jQuery模仿京东/天猫商品左侧分类导航菜单效果
2016/06/29 Javascript
利用bootstrapValidator验证UEditor
2016/09/14 Javascript
Jquery循环截取字符串的方法(多出的字符串处理成&quot;...&quot;)
2016/11/28 Javascript
Angular.js实现动态加载组件详解
2017/05/28 Javascript
详解vue配置后台接口方式
2019/03/29 Javascript
使用 vue 实例更好的监听事件及vue实例的方法
2019/04/22 Javascript
基于Vue的商品主图放大镜方案详解
2019/09/19 Javascript
解决微信小程序scroll-view组件无横向滚动的问题
2020/02/04 Javascript
如何使用 JavaScript 操作浏览器历史记录 API
2020/11/24 Javascript
[03:07]2015国际邀请赛选手档案EHOME.rOtK 是什么让他落泪?
2015/07/31 DOTA
Python之re操作方法(详解)
2017/06/14 Python
分享几道你可能遇到的python面试题
2017/07/24 Python
Python实现字典(dict)的迭代操作示例
2018/06/05 Python
关于numpy中eye和identity的区别详解
2019/11/29 Python
世界上最大的售后摩托车零配件超市:J&P Cycles
2017/12/08 全球购物
女装和独特珠宝:Sundance Catalog
2018/09/19 全球购物
英国手工制作的现代与经典的沙发和床:Love Your Home
2020/09/26 全球购物
最新奶茶店创业计划书
2014/01/25 职场文书
告诉你怎样写创业计划书
2014/01/27 职场文书
五星级酒店餐饮部总监的标准岗位职责
2014/02/17 职场文书
学校元旦晚会方案
2014/02/19 职场文书
硕士生工作推荐信
2014/03/07 职场文书
《美丽的南沙群岛》教学反思
2014/04/27 职场文书
政府门卫岗位职责
2014/04/29 职场文书
《我爱祖国》演讲稿1000字
2014/09/26 职场文书
公司周年庆典致辞
2015/07/30 职场文书
Redis keys命令的具体使用
2022/06/05 Redis