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 相关文章推荐
excel操作之Add Data to a Spreadsheet Cell
Jun 12 Javascript
浏览器页面区域大小的js获取方法
Sep 21 Javascript
jquery制作select列表双向选择示例代码
Sep 02 Javascript
JS实现控制表格只显示行边框或者只显示列边框的方法
Mar 31 Javascript
在JavaScript中操作时间之getYear()方法的使用教程
Jun 11 Javascript
关于js里的this关键字的理解
Aug 17 Javascript
jquery实现左右无缝轮播图
Jul 31 Javascript
AngularJS通过$location获取及改变当前页面的URL
Sep 23 Javascript
vue文件树组件使用详解
Mar 29 Javascript
JavaScript面向对象程序设计中对象的定义和继承详解
Jul 29 Javascript
nuxt 实现在其它js文件中使用store的方式
Nov 05 Javascript
利用JS判断元素是否为数组的方法示例
Jan 08 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环境配置 php5 MySQL5 apache2 phpmyadmin安装与配置图文教程
2007/03/16 PHP
php5 mysql分页实例代码
2008/04/10 PHP
开源SNS系统-ThinkSNS
2008/05/18 PHP
php中的一些数组排序方法分享
2012/07/20 PHP
laravel5.0在linux下解决.htaccess无效和去除index.php的问题
2019/10/16 PHP
PHP $O00OO0=urldecode &amp; eval 解密,记一次商业源码的去后门
2020/09/13 PHP
passwordStrength 基于jquery的密码强度检测代码使用介绍
2011/10/08 Javascript
3个可以改善用户体验的AngularJS指令介绍
2015/06/18 Javascript
基于jQuery通过jQuery.form.js插件使用ajax提交form表单
2015/08/17 Javascript
jQuery的选择器中的通配符[id^='code']或[name^='code']及jquery选择器总结
2015/12/24 Javascript
javascript实现抽奖程序的简单实例
2016/06/07 Javascript
简单实现bootstrap选项卡效果
2017/02/08 Javascript
Angular4实现动态添加删除表单输入框功能
2017/08/11 Javascript
微信小程序 input输入及动态设置按钮的实现
2017/10/27 Javascript
代码详解javascript模块加载器
2018/03/04 Javascript
js自定义input文件上传样式
2018/10/26 Javascript
node上的redis调用优化示例详解
2018/10/30 Javascript
Javascript实现动态时钟效果
2018/11/17 Javascript
微信小程序非swiper组件实现的自定义伪3D轮播图效果示例
2018/12/11 Javascript
小程序rich-text组件如何改变内部img图片样式的方法
2019/05/22 Javascript
nodejs dgram模块广播+组播的实现示例
2019/11/04 NodeJs
推荐几个不错的console调试技巧实现
2019/12/20 Javascript
Python基础篇之初识Python必看攻略
2016/06/23 Python
Tensorflow的可视化工具Tensorboard的初步使用详解
2018/02/11 Python
使用Python进行体育竞技分析(预测球队成绩)
2019/05/16 Python
Python math库 ln(x)运算的实现及原理
2019/07/17 Python
Django3.0 异步通信初体验(小结)
2019/12/04 Python
用python实现学生管理系统
2020/07/24 Python
HTML5 video 上传预览图片视频如何设置、预览视频某秒的海报帧
2018/08/28 HTML / CSS
一套VC试题
2015/01/23 面试题
留学推荐信写作指南
2014/01/25 职场文书
《诚实与信任》教学反思
2014/04/10 职场文书
高三上学期学习自我评价
2014/04/23 职场文书
一帮一活动总结
2014/05/08 职场文书
卫生标语大全
2014/06/21 职场文书
辛亥革命观后感
2015/06/02 职场文书