JS针对浏览器窗口关闭事件的监听方法集锦


Posted in Javascript onJune 24, 2016

本文实例总结了JS针对浏览器窗口关闭事件的监听方法。分享给大家供大家参考,具体如下:

方式一:(适用于IE浏览器,而且刷新不提示,只在点击浏览器关闭按钮的时候提示)

<script type="text/javascript">
window.onbeforeunload=onclose;
function onclose()
{
if(event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey)
{
return "您要离开吗?";
}
}
</script>

方式二:适用于IE和FF,不区分刷新和关闭

<script type="text/javascript">
  window.onbeforeunload = onbeforeunload_handler;
  window.onunload = onunload_handler;
  function onbeforeunload_handler(){
    var warning="确认退出?";
    return warning;
  }
  function onunload_handler(){
    var warning="谢谢光临";
    alert(warning);
  }
</script>

方式三:适用于IE和FF,不区分刷新和关闭,最简单的

<script type="text/javascript">
window.onbeforeunload=onclose;
function onclose()
{
return "您确定退出吗?";
}
</script>

方式四:适用于IE和FF,不区分刷新和关闭,稍复杂的

<script language="javascript">
var MSG_UNLOAD="如果你此时离开档案系统,所做操作信息将全部丢失,是否离开?";
var UnloadConfirm = {};
//启用监听浏览器刷新、关闭的方法
UnloadConfirm.set = function(confirm_msg){
  window.onbeforeunload = function(event){
    event = event || window.event;
    event.returnValue = confirm_msg;
  }
}
//关闭监听浏览器刷新、关闭的方法
UnloadConfirm.clear = function(){
  window.onbeforeunload = function(){};
}
UnloadConfirm.set(MSG_UNLOAD);
</script>

方式五:只适用于IE6下的关闭按钮和快捷键关闭的,刷新不提示

<script type="text/javascript">
window.onbeforeunload=onclose;
function onclose()
{
var warnning = '<fmt:message key="systemMessage.exitWarning" />';
var beforeExit='<fmt:message key="systemMessage.beforeExitWarning" />';
 if(event.clientY<0 && event.clientX>document.body.clientWidth-20 || event.clientY<0 && event.clientX<20 ||
event.altKey || event.ctrlKey || event.clientY>document.body.clientHeight){
alert(beforeExit);
return warnning;
}
}
</script>

另附判断浏览器类型的JS

<script type="text/javascript">
    var Sys = {};
    var ua = navigator.userAgent.toLowerCase();
    if (window.ActiveXObject)
      Sys.ie = ua.match(/msie ([\d.]+)/)[1]
    else if (document.getBoxObjectFor)
      Sys.firefox = ua.match(/firefox\/([\d.]+)/)[1]
    else if (window.MessageEvent && !document.getBoxObjectFor)
      Sys.chrome = ua.match(/chrome\/([\d.]+)/)[1]
    else if (window.opera)
      Sys.opera = ua.match(/opera.([\d.]+)/)[1]
    else if (window.openDatabase)
      Sys.safari = ua.match(/version\/([\d.]+)/)[1];
    //以下进行测试
    if(Sys.ie) document.write('IE: '+Sys.ie);
    if(Sys.firefox) document.write('Firefox: '+Sys.firefox);
    if(Sys.chrome) document.write('Chrome: '+Sys.chrome);
    if(Sys.opera) document.write('Opera: '+Sys.opera);
    if(Sys.safari) document.write('Safari: '+Sys.safari);
</script>

区分浏览器,IE和FF分别处理(奇怪的是,IE下有时候失效)

<script type="text/javascript">
window.onbeforeunload=onclose;
function onclose()
{
var Sys = {};
var warnning = '<fmt:message key="systemMessage.exitWarning" />';
var ua = navigator.userAgent.toLowerCase();
if (window.ActiveXObject)
  Sys.ie = ua.match(/msie ([\d.]+)/)[1]
else if (document.getBoxObjectFor)
  Sys.firefox = ua.match(/firefox\/([\d.]+)/)[1]
if(Sys.ie) {//for IE
if(event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey)
{
window.event.returnValue = warnning ;
}
}
if(Sys.firefox) //for FF
return warnning;
}
</script>

最简单的判断浏览器类型的方法

<script type="text/javascript">
if(-[1,]){
   alert("这不是IE浏览器!");
}else{
   alert("这是IE浏览器!");
}
</script>

[1,]在标准浏览器会返回字符串"1",相当于调用[1,].toString,
,IE则返回"1,"。但是这样IE与标准都会通过检测,因此使用负号强制转换为数字,

标准能成功转换为1,1会在if中自动转换为true,而IE则转换为NaN,再自动转换为false!

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
FireFox与IE 下js兼容触发click事件的代码
Nov 20 Javascript
jquery 模拟雅虎首页的点击对话框效果
Apr 11 Javascript
用XMLDOM和ADODB.Stream实现base64编码解码实现代码
Nov 28 Javascript
JS 控件事件小结
Oct 31 Javascript
javascript查询字符串参数的方法
Jan 28 Javascript
javascript框架设计之类工厂
Jun 23 Javascript
基于Jquery实现仿百度百科右侧导航代码附源码下载
Nov 27 Javascript
JS对HTML表格进行增删改操作
Aug 22 Javascript
js实现跟随鼠标移动的小球
Aug 26 Javascript
js实现小时钟效果
Mar 25 Javascript
Vue实现图书管理案例
Jan 20 Vue.js
TS 类型兼容教程示例详解
Sep 23 Javascript
JS实现iframe自适应高度的方法(兼容IE与FireFox)
Jun 24 #Javascript
AngularJS 路由和模板实例及路由地址简化方法(必看)
Jun 24 #Javascript
老生常谈 关于JavaScript的类的继承
Jun 24 #Javascript
js动态获取子复选项并设计全选及提交的实现方法
Jun 24 #Javascript
EasyUI在表单提交之前进行验证的实例代码
Jun 24 #Javascript
正则表达式(语法篇推荐)
Jun 24 #Javascript
javascript弹出窗口中增加确定取消按钮
Jun 24 #Javascript
You might like
老机欣赏|中国60年代精品收音机
2021/03/02 无线电
php执行sql语句的写法
2009/03/10 PHP
php发送html格式文本邮件的方法
2015/06/10 PHP
php实现zip文件解压操作
2015/11/03 PHP
PHP小白必须要知道的php基础知识(超实用)
2017/10/10 PHP
33种Javascript 表格排序控件收集
2009/12/03 Javascript
淘宝网提供的国内NPM镜像简介和使用方法
2014/04/17 Javascript
javascript去除字符串中所有标点符号和提取纯文本的正则
2014/06/07 Javascript
jQuery+ajax实现鼠标单击修改内容的思路
2014/06/29 Javascript
网站接入QQ登录的两种方法
2014/07/22 Javascript
基于jquery实现发送文章到手机的代码
2014/12/26 Javascript
jQuery拖拽插件gridster使用指南
2015/04/21 Javascript
javascript实现查找数组中最大值方法汇总
2016/02/13 Javascript
js多功能分页组件layPage使用方法详解
2016/05/19 Javascript
微信小程序删除处理详解
2017/08/16 Javascript
JS使用tofixed与round处理数据四舍五入的区别
2017/10/25 Javascript
JavaScript定义及输出螺旋矩阵的方法详解
2017/12/01 Javascript
vue弹窗消息组件的使用方法
2020/09/24 Javascript
JavaScript的词法结构精华篇
2018/10/17 Javascript
vue 详情跳转至列表页实现列表页缓存
2019/03/27 Javascript
python爬取NUS-WIDE数据库图片
2016/10/05 Python
Python 基础教程之str和repr的详解
2017/08/20 Python
详解Python 序列化Serialize 和 反序列化Deserialize
2017/08/20 Python
用Python写脚本,实现完全备份和增量备份的示例
2018/04/29 Python
利用python如何处理nc数据详解
2018/05/23 Python
Python绘制KS曲线的实现方法
2018/08/13 Python
ubuntu上安装python的实例方法
2019/09/30 Python
new_zeros() pytorch版本的转换方式
2020/02/18 Python
python3.6中anaconda安装sklearn踩坑实录
2020/07/28 Python
HTML5中实现拖放效果无须借助javascript
2012/12/26 HTML / CSS
C#的几个面试问题
2016/05/22 面试题
幼儿园教育教学反思
2014/01/31 职场文书
辞职信标准格式
2015/02/27 职场文书
保研推荐信范文
2015/03/25 职场文书
导游词之西安大清真寺
2019/12/17 职场文书
python本地文件服务器实例教程
2021/05/02 Python