判断用户的在线状态 onbeforeunload事件


Posted in Javascript onMarch 05, 2011

获得用户登陆状态不用说了,判断离开的话就有一点问题了,如果说用户都是按照设计者的规定触发退出事件离开的话那就没什么难度了,但是用户的离开方式多种多样,怎么在用户非法离开的时候即时的判断离开呢?最常见的非法离开就是关闭浏览器了。

<BODY onbeforeunload="body_onUnload()"> 
<script> 
window.onbeforeunload = function() { 
if (window.event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey) 
{ 
alert("浏览器关闭"); 
} 
else 
{ 
alert("刷新或者跳转到其他页"); 
} 
} 
</script> 
</BODY>

以上是一个片段,BODY 的 UNLOAD和onbeforeunload事件会在浏览器清除所加载的信息时被触发,也就是说页面在回送、重定向或被关闭的时候就会触发 ,通过这个事件加上JAVASCRIPT处理就可以实现非法关闭浏览器也即时统计在线人数了。

但是有个问题,怎么判断用户是关闭还是刷新、回送、重定向呢?

window.event.clientX和window.event.clientY 将捕捉当前事件发生时鼠标相对与窗口的桌面坐标,通常情况下IE的关闭按钮都会在页面的右上部分,所以点关闭的时候鼠标的坐标的Y坐标一定是小于0的,另外,鼠标坐标的X方向上坐标数值会大于窗体宽度,所以,从这两个条件就可以判断鼠标是不是在点关闭按钮引发的onbeforeload事件。
还有一种关闭方法是ALT+F4 ,通过event.altKey就可以判断,事件发生的时候ALT键是不是被按下了,这样也就判断出了是不是时候ALT+F4来关闭窗口。

不过也出现一个问题,当使用一些特殊的左面主题的时候 关闭按钮可触发的坐标数值不一定小于窗体宽度,所以,上面例子中的window.event.clientX>document.body.clientWidth这个条件可以不要.

Javascript 相关文章推荐
VBS通过WMI监视注册表变动的代码
Oct 27 Javascript
javascript小组件 原生table排序表格脚本(兼容ie firefox opera chrome)
Jul 25 Javascript
jquery 淡入淡出效果的简单实现
Feb 07 Javascript
jquery通过load获取文件的内容并跳到锚点的方法
Jan 29 Javascript
JavaScript实现将数组数据添加到Select下拉框的方法
Aug 21 Javascript
使用postMesssage()实现iframe跨域页面间的信息传递
Mar 29 Javascript
JS中对象与字符串的互相转换详解
May 20 Javascript
vue.js 获取当前自定义属性值
Jun 01 Javascript
详解Vue2.0 事件派发与接收
Sep 05 Javascript
JS原生瀑布流效果实现
Apr 26 Javascript
Vue组件模板的几种书写形式(3种)
Feb 19 Javascript
js实现滚动条自动滚动
Dec 13 Javascript
在多个页面使用同一个HTML片段《续》
Mar 04 #Javascript
在多个页面使用同一个HTML片段的代码
Mar 04 #Javascript
如何确保JavaScript的执行顺序 之实战篇
Mar 03 #Javascript
如何确保JavaScript的执行顺序 之jQuery.html并非万能钥匙
Mar 03 #Javascript
如何确保JavaScript的执行顺序 之jQuery.html深度分析
Mar 03 #Javascript
jQuery 操作option的实现代码
Mar 03 #Javascript
基于Jquery的$.cookie()实现跨越页面tabs导航实现代码
Mar 03 #Javascript
You might like
phpMyAdmin 链接表的附加功能尚未激活的问题
2010/08/01 PHP
php set_time_limit()函数的使用详解
2013/06/05 PHP
PHP Session 变量的使用方法详解与实例代码
2013/09/11 PHP
thinkphp特殊标签用法概述
2014/11/24 PHP
phpStudy中升级MySQL版本到5.7.17的方法步骤
2017/08/03 PHP
PHP convert_cyr_string()函数讲解
2019/02/13 PHP
php转换上传word文件为PDF的方法【基于COM组件】
2019/06/10 PHP
Javascript下判断是否为闰年的Datetime包
2010/10/26 Javascript
jQuery之按钮组件的深入解析
2013/06/19 Javascript
js获取url参数值的两种方式
2013/09/10 Javascript
javaScript中定义类或对象的五种方式总结
2016/12/04 Javascript
jQuery实现文字自动横移
2017/01/08 Javascript
原生JS实现移动端web轮播图详解(结合Tween算法造轮子)
2017/09/10 Javascript
vue单个组件实现无限层级多选菜单功能
2018/04/10 Javascript
JS插件clipboard.js实现一键复制粘贴功能
2020/12/04 Javascript
Vue.js 父子组件通信的十种方式
2018/10/30 Javascript
layui(1.0.9)文件上传upload,前后端的实例代码
2019/09/26 Javascript
python生成随机密码或随机字符串的方法
2015/07/03 Python
python常见的格式化输出小结
2016/12/15 Python
Python查询IP地址归属完整代码
2017/06/21 Python
python3实现网络爬虫之BeautifulSoup使用详解
2018/12/19 Python
详解pandas的外部数据导入与常用方法
2019/05/01 Python
Python Web框架之Django框架cookie和session用法分析
2019/08/16 Python
python多线程实现同时执行两个while循环的操作
2020/05/02 Python
django的403/404/500错误自定义页面的配置方式
2020/05/21 Python
聊聊python中的异常嵌套
2020/09/01 Python
想学画画?python满足你!
2020/12/24 Python
解析浏览器的一些“滚动”行为鉴赏
2019/09/16 HTML / CSS
香港太阳眼镜网上商店:SmartBuyGlasses香港
2016/07/22 全球购物
中专毕业生自荐信
2013/11/16 职场文书
九年级科学教学反思
2014/01/29 职场文书
批评与自我批评总结
2014/10/17 职场文书
总经理岗位职责
2015/02/04 职场文书
获奖感言范文
2015/07/31 职场文书
2016国庆节活动宣传语
2015/11/25 职场文书
php将xml转化对象的实例详解
2021/11/17 PHP