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 相关文章推荐
基于JQuery制作可编辑的表格特效
Dec 23 Javascript
javascript实现列表滚动的方法
Jul 30 Javascript
JavaScript图片轮播代码分享
Jul 31 Javascript
JS实现点击事件统计的简单实例
Jul 10 Javascript
最简单纯JavaScript实现Tab标签页切换的方式(推荐)
Jul 25 Javascript
利用原生JS与jQuery实现数字线性变化的动画
Feb 24 Javascript
详解用vue.js和laravel实现微信支付
Jun 23 Javascript
Three.js中网格对象MESH的属性与方法详解
Sep 27 Javascript
web前端开发中常见的多列布局解决方案整理(一定要看)
Oct 15 Javascript
JavaScript简单编程实例学习
Feb 14 Javascript
TypeScript 运行时类型检查补充工具
Sep 28 Javascript
jquery实现图片放大镜效果
Dec 23 jQuery
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代码网站如何防范SQL注入漏洞攻击建议分享
2012/03/01 PHP
smarty内置函数{loteral}、{ldelim}和{rdelim}用法实例
2015/01/22 PHP
CI框架AR数据库操作常用函数总结
2016/11/21 PHP
jquery 元素控制(追加元素/追加内容)介绍及应用
2013/04/21 Javascript
javascript eval(func())使用示例
2013/12/05 Javascript
jQuery中Ajax的get、post等方法详解
2015/01/20 Javascript
JS实现仿FLASH效果的竖排导航代码
2015/09/15 Javascript
实例讲解javascript注册事件处理函数
2016/01/09 Javascript
JavaScript检查子字符串是否在字符串中的方法
2016/02/03 Javascript
使用js获取地址栏参数的方法推荐(超级简单)
2016/06/14 Javascript
JS实现关闭当前页而不弹出提示框的方法
2016/06/22 Javascript
通过JS获取Request.QueryString()参数的值实现方法
2016/09/27 Javascript
详解Angular2 关于*ngFor 嵌套循环
2017/05/22 Javascript
AngularJS实现select的ng-options功能示例
2017/07/12 Javascript
web前端vue filter 过滤器
2018/01/12 Javascript
使用rollup打包JS的方法步骤
2018/12/05 Javascript
Paypal支付不完全指北
2020/06/04 Javascript
ant design vue datepicker日期选择器中文化操作
2020/10/28 Javascript
JavaScript实现网页计算器功能
2020/10/29 Javascript
Python的Django框架中的表单处理示例
2015/07/17 Python
Python针对给定字符串求解所有子序列是否为回文序列的方法
2018/04/21 Python
Python rstrip()方法实例详解
2018/11/11 Python
解决python中使用PYQT时中文乱码问题
2019/06/17 Python
详解pandas数据合并与重塑(pd.concat篇)
2019/07/09 Python
在Pytorch中计算卷积方法的区别详解(conv2d的区别)
2020/01/03 Python
微软俄罗斯官方网站:Microsoft俄罗斯
2016/09/18 全球购物
大学生职业生涯规划范文
2013/12/31 职场文书
企业内部培训方案
2014/02/04 职场文书
水污染治理工程专业自荐信
2014/06/21 职场文书
幼儿园中班区域活动总结
2014/07/09 职场文书
政风行风整改方案
2014/10/25 职场文书
公路局群众路线教育实践活动第一阶段工作汇报
2014/10/25 职场文书
2014年作风建设工作总结
2014/10/29 职场文书
《暗黑破坏神2:重制版》本周进行第一轮A测 目前可官网进行申请报名
2021/04/07 其他游戏
用Python写一个简易版弹球游戏
2021/04/13 Python
Vue router配置与使用分析讲解
2022/12/24 Vue.js