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 相关文章推荐
利用javascript/jquery对上传文件格式过滤的方法
Jul 25 Javascript
仿中关村在线首页弹出式广告插件(jQuery版)
May 03 Javascript
javascript scrollTop正解使用方法
Nov 14 Javascript
js仿百度贴吧验证码特效实例代码
Jan 16 Javascript
jquery动态调整div大小使其宽度始终为浏览器宽度
Jun 06 Javascript
jquery图片切换插件
Mar 16 Javascript
Express的路由详解
Dec 10 Javascript
分析js闭包引起的事件注册问题
Mar 29 Javascript
基于jQuery实现中英文切换导航条效果
Sep 18 Javascript
jQuery实现优雅的弹窗效果(6)
Feb 08 Javascript
微信小程序slider组件使用详解
Jan 31 Javascript
js实现无缝滚动双图切换效果
Jul 09 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 将图片按创建时间进行分类存储的实现代码
2010/01/05 PHP
php实现在线生成条形码示例分享(条形码生成器)
2013/12/30 PHP
php Calender(日历)代码分享
2014/01/03 PHP
在Mac OS上编译安装Nginx+PHP+MariaDB开发环境的教程
2016/02/23 PHP
PHP实现递归的三种方法
2020/07/04 PHP
Jquery通过Ajax方式来提交Form表单的具体实现
2013/11/07 Javascript
JavaScript用JQuery呼叫Server端方法示例代码
2014/09/03 Javascript
JavaScript绑定事件监听函数的通用方法
2016/05/14 Javascript
Sortable.js拖拽排序使用方法解析
2016/11/04 Javascript
jquery获取table指定行和列的数据方法(当前选中行、列)
2016/11/07 Javascript
vue2.0+webpack环境的构造过程
2016/11/08 Javascript
js 数据存储和DOM编程
2017/02/09 Javascript
nodeJS实现简单网页爬虫功能的实例(分享)
2017/06/08 NodeJs
React-redux实现小案例(todolist)的过程
2019/09/29 Javascript
关于element-ui表单中限制输入纯数字的解决方式
2020/09/08 Javascript
python实现ip查询示例
2014/03/26 Python
Scrapy爬虫实例讲解_校花网
2017/10/23 Python
基于Python实现的ID3决策树功能示例
2018/01/02 Python
python实现简单登陆流程的方法
2018/04/22 Python
详解Django解决ajax跨域访问问题
2018/08/24 Python
python opencv圆、椭圆与任意多边形的绘制实例详解
2020/02/06 Python
pytorch 模型的train模式与eval模式实例
2020/02/20 Python
Python基于内置函数type创建新类型
2020/10/22 Python
CSS3混合模式mix-blend-mode/background-blend-mode简介
2018/03/15 HTML / CSS
彻底弄明白CSS3的Media Queries(跨平台设计)
2010/07/27 HTML / CSS
英国在线自行车商店:Evans Cycles
2016/09/26 全球购物
Office DEPOT法国官网:欧迪办公用品采购
2018/01/03 全球购物
美国农场鲜花速递:The Bouqs
2018/07/13 全球购物
100%法国制造的游戏和玩具:Les Jouets Français
2021/03/02 全球购物
什么叫应用程序域?什么是托管代码?什么是强类型系统?什么是装箱和拆箱?什么是重载?CTS、CLS和CLR分别作何解释?
2012/05/23 面试题
大学生个人简历中的自我评价
2013/12/27 职场文书
2014年社区学雷锋活动总结
2014/03/09 职场文书
2014年高考决心书
2014/03/11 职场文书
销售会计岗位职责
2014/03/15 职场文书
群教班子对照检查材料
2014/08/26 职场文书
创新创业项目计划书该怎样写?
2019/08/13 职场文书