javascript在当前窗口关闭前检测窗口是否关闭


Posted in Javascript onSeptember 29, 2014

在当前窗口关闭前,检测当前窗口是否关闭

<pre name="code" class="html"><pre name="code" class="html"><HTML><HEAD> 
<script Language="JavaScript"> 
window.onbeforeunload=function(event){ 
alert("222"); //这里IE9会执行,CHROME不会执行 
// if(event.clientX>document.body.clientWidth && event.clientY<0||event.altKey){ //如果是刷新,则不提示 
RETURN "确定关闭窗口?"; 
// } 
} 
var aa ; 
var intervalVar; 
function showClose(){ 
console.log(" wait and val is :"+aa.closed); 
clearInterval(intervalVar); 
} 
function loadform(){ 
aa=window.open('foo.html', 'windowName',"width=200,height=200,scrollbars=no"); 
console.log("check close before op and val is :"+aa.closed); //现在窗口未关闭,结果为false 
aa.close();<span style="white-space:pre"> </span> //调用窗口关闭的方法 
console.log("not in wait and val is :"+aa.closed); //此时aa.close正在调用过程中,结果为false 
intervalVar = setInterval(showClose,100); }; //用循环检测子窗口是否关闭,其实用setTimeout也是可以的,不过值要设得大一些 
function unloadform(){ alert("2!"); } 
</script> 
</HEAD><BODY OnLoad="loadform()" OnUnload="unloadform()"> 
</BODY></HTML>

在ie9中,如果刷新文档的话,unloadform和onbeforeunload都会执行,如果是关闭页面的话只会执行onbeforeunload事件

值得注意的是,onunload在关闭页面时不会运行,估计此函数为浏览器内置事件,不能重新定义

在chrome中,如果刷新文档的话,unloadform和onbeforeunload都会执行,关闭页面的话,只会执行onbeforeunload,值得注意的是有注释的那一行一直不会执行.

如果是window.open打开的子窗口的话,可以通过window.closed属性检测是否关闭

<HTML><HEAD> 
<script Language="JavaScript"> 
var aa ; 
var intervalVar; 
function showClose(){ 
console.log(" wait and val is :"+aa.closed); 
clearInterval(intervalVar); 
} 
function loadform(){ 
aa=window.open('foo.html', 'windowName',"width=200,height=200,scrollbars=no"); 
console.log("check close before op and val is :"+aa.closed); //现在窗口未关闭,结果为false 
aa.close(); //调用窗口关闭的方法 
console.log("not in wait and val is :"+aa.closed); //此时aa.close正在调用过程中,结果为false 
intervalVar = setInterval(showClose,100); }; //用循环检测子窗口是否关闭,其实用setTimeout也是可以的,不过值要设得大一些 
function unloadform(){ alert("2!"); } 
</script> 
</HEAD><BODY OnLoad="loadform()" OnUnload="unloadform()"> <a href="test.htm">调用</a> 
</BODY></HTML>

父窗口关闭时会自动将window.open关闭的代码

<HTML><HEAD> 
<script Language="JavaScript"> 
var aa ; 
var intervalVar; 
window.onbeforeunload=function(event){ 
aa.close(); 
return "hello"; 
} 
function loadform(){ 
aa=window.open('test.htm', 'windowName',"width=200,height=200,scrollbars=no"); 
}; 
function unloadform(){ alert("2!"); } 
</script> 
</HEAD><BODY OnLoad="loadform()" OnUnload="unloadform()"> <a href="test.htm">调用</a> 
</BODY></HTML>
Javascript 相关文章推荐
brook javascript框架介绍
Oct 10 Javascript
下载文件个别浏览器文件名乱码解决办法
Mar 19 Javascript
Javascript中Event属性搜集整理
Sep 17 Javascript
javascript 寻找错误方法整理
Jun 15 Javascript
教你在heroku云平台上部署Node.js应用
Jul 30 Javascript
jQuery实用函数用法总结
Aug 29 Javascript
jquery实现带缩略图的可定制高度画廊效果(5种)
Aug 28 Javascript
JS判断日期格式是否合法的简单实例
Jul 11 Javascript
js实现选项卡内容切换以及折叠和展开效果【推荐】
Jan 08 Javascript
vue slot 在子组件中显示父组件传递的模板
Mar 02 Javascript
对angularJs中ng-style动态改变样式的实例讲解
Sep 30 Javascript
在vue中axios设置timeout超时的操作
Sep 04 Javascript
js+csss实现的一个带复选框的下拉框
Sep 29 #Javascript
js监听鼠标事件控制textarea输入字符串的个数
Sep 29 #Javascript
JavaScript声明变量时为什么要加var关键字
Sep 29 #Javascript
Javascript基础知识(三)BOM,DOM总结
Sep 29 #Javascript
Javascript基础知识(二)事件
Sep 29 #Javascript
Javascript基础知识(一)核心基础语法与事件模型
Sep 29 #Javascript
Javascript表单验证要注意的事项
Sep 29 #Javascript
You might like
php和mysql中uft-8中文编码乱码的几种解决办法
2012/04/19 PHP
php文件上传的简单实例
2013/10/19 PHP
PHP SPL标准库之接口(Interface)详解
2015/05/11 PHP
详解PHP神奇又有用的Trait
2019/03/25 PHP
js 页面输出值
2008/11/30 Javascript
javascript 获取元素位置的快速方法 getBoundingClientRect()
2009/11/26 Javascript
jQuery实现的立体文字渐变效果
2010/05/17 Javascript
鼠标拖动实现DIV排序示例代码
2013/10/14 Javascript
JavaScript中双叹号!!作用示例介绍
2014/09/21 Javascript
你所不了解的javascript操作DOM的细节知识点(一)
2015/06/17 Javascript
jquery悬浮提示框完整实例
2016/01/13 Javascript
javascript实现2016新年版日历
2016/01/25 Javascript
jQuery实现返回顶部功能
2016/02/23 Javascript
Vue.directive自定义指令的使用详解
2017/03/10 Javascript
vue单页缓存存在的问题及解决方案(小结)
2018/09/25 Javascript
JavaScript实现数字前补“0”的五种方法示例
2019/01/03 Javascript
浅谈JavaScript_DOM学习篇_图片切换小案例
2019/03/19 Javascript
使用Element的InfiniteScroll 无限滚动组件报错的解决
2020/07/27 Javascript
在Python中使用Mako模版库的简单教程
2015/04/08 Python
numpy.random.seed()的使用实例解析
2018/02/03 Python
Python简单实现查找一个字符串中最长不重复子串的方法
2018/03/26 Python
详解flask表单提交的两种方式
2018/07/21 Python
Python读取csv文件分隔符设置方法
2019/01/14 Python
python并发编程 Process对象的其他属性方法join方法详解
2019/08/20 Python
python连接PostgreSQL数据库的过程详解
2019/09/18 Python
Pycharm如何导入python文件及解决报错问题
2020/05/10 Python
python批量处理多DNS多域名的nslookup解析实现
2020/06/28 Python
意大利简约的休闲品牌:Aspesi
2018/02/08 全球购物
全球独特生活方式产品和礼品购物网站:AHAlife
2018/09/18 全球购物
美国电力供应商店/电气批发商:USESI
2018/10/12 全球购物
经典c++面试题五
2014/12/17 面试题
劳动实践课感言
2014/02/01 职场文书
行政专员求职信范文
2014/05/03 职场文书
局火灾防控工作方案
2014/05/25 职场文书
标准单位租车协议书
2014/09/23 职场文书
SpringBoot整合Redis入门之缓存数据的方法
2021/11/17 Redis