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 相关文章推荐
extjs 为某个事件设置拦截器
Jan 15 Javascript
JavaScript面向对象程序设计三 原型模式(上)
Dec 21 Javascript
利用JS延迟加载百度分享代码,提高网页速度
Jul 01 Javascript
Javascript Ajax异步读取RSS文档具体实现
Dec 12 Javascript
jquery JSON的解析方式示例介绍
Jul 27 Javascript
Javascript中数组去重与拍平的方法示例
Feb 03 Javascript
php 修改密码实现代码
May 24 Javascript
JavaScript对象的浅拷贝与深拷贝实例分析
Jul 25 Javascript
详谈js的变量提升以及使用方法
Oct 06 Javascript
jquery+css实现Tab栏切换的代码实例
May 14 jQuery
使用原生JS实现火锅点餐小程序(面向对象思想)
Dec 10 Javascript
浅谈js数组splice删除某个元素爬坑
Oct 14 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
php 多关键字 高亮显示实现代码
2012/04/23 PHP
PHP实现过滤各种HTML标签
2015/05/17 PHP
PHP制作用户注册系统
2015/10/23 PHP
Smarty模板变量调节器用法分析
2016/05/23 PHP
JavaScript 编程引入命名空间的方法
2007/06/29 Javascript
文本框输入时 实现自动提示(像百度、google一样)
2012/04/05 Javascript
判定是否原生方法的JS代码
2013/11/12 Javascript
struts2+jquery组合验证注册用户是否存在
2014/04/30 Javascript
jQuery 选择器详解
2015/01/19 Javascript
纯JS代码实现隔行变色鼠标移入高亮
2016/11/23 Javascript
jQuery源码分析之sizzle选择器详解
2017/02/13 Javascript
jQuery插件echarts去掉垂直网格线用法示例
2017/03/03 Javascript
canvas实现刮刮卡效果
2017/03/14 Javascript
Node.js中的http请求客户端示例(request client)
2017/05/04 Javascript
JS实现匀加速与匀减速运动的方法示例
2017/09/04 Javascript
详解NODEJS基于FFMPEG视频推流测试
2017/11/17 NodeJs
vue实现样式之间的切换及vue动态样式的实现方法
2017/12/19 Javascript
使用element-ui table expand展开行实现手风琴效果
2019/03/15 Javascript
Vue.js@2.6.10更新内置错误处机制Fundebug同步支持相应错误监控
2019/05/13 Javascript
python实现带声音的摩斯码翻译实现方法
2015/05/20 Python
opencv python 基于KNN的手写体识别的实例
2018/08/03 Python
Scrapy框架使用的基本知识
2018/10/21 Python
Python字典的概念及常见应用实例详解
2019/10/30 Python
Django框架表单操作实例分析
2019/11/04 Python
python实现引用其他路径包里面的模块
2020/03/09 Python
Django更新models数据库结构步骤
2020/04/01 Python
pytorch判断是否cuda 判断变量类型方式
2020/06/23 Python
Python 没有main函数的原因
2020/07/10 Python
python3实现简单飞机大战
2020/11/29 Python
当当网官方旗舰店:中国图书销售夺金品牌
2018/04/02 全球购物
自我鉴定200字
2013/10/28 职场文书
《影子》教学反思
2014/02/21 职场文书
忠诚教育心得体会
2014/09/03 职场文书
2016年9月份红领巾广播稿
2015/12/21 职场文书
我的中国梦心得体会范文
2016/01/05 职场文书
nginx如何将http访问的网站改成https访问
2021/03/31 Servers