判断用户的在线状态 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 相关文章推荐
自定义右键属性覆盖浏览器默认右键行为实现代码
Feb 02 Javascript
JavaScript利用构造函数和原型的方式模拟C#类的功能
Mar 06 Javascript
js脚本获取webform服务器控件的方法
May 16 Javascript
基于MVC4+EasyUI的Web开发框架形成之旅之界面控件的使用
Dec 16 Javascript
深入理解JavaScript中为什么string可以拥有方法
May 24 Javascript
jQuery基于事件控制实现点击显示内容下拉效果
Mar 07 Javascript
angularjs中的$eval方法详解
Apr 24 Javascript
理顺8个版本vue的区别(小结)
Sep 17 Javascript
JavaScript模板引擎实现原理实例详解
Dec 14 Javascript
详解javascript对数组和json数组的操作
Apr 15 Javascript
JS Array.from()将伪数组转换成数组的方法示例
Mar 23 Javascript
详解Js模块化的作用原理和方案
Apr 29 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
用缓存实现静态页面的测试
2006/12/06 PHP
php网页后退不再出现过期
2007/03/08 PHP
PHP 裁剪图片成固定大小代码方法
2009/09/09 PHP
说说PHP的autoLoad自动加载机制
2012/09/27 PHP
php格式化日期和时间格式化示例分享
2014/02/24 PHP
PHP编程中尝试程序并发的几种方式总结
2016/03/21 PHP
CodeIgniter常用知识点小结
2016/05/26 PHP
php获得文件夹下所有文件的递归算法的简单实例
2016/11/01 PHP
thinkphp3.2嵌入百度编辑器ueditor的实例代码
2017/07/13 PHP
laravel框架之数据库查出来的对象实现转化为数组
2019/10/23 PHP
js中的escape及unescape函数的php实现代码
2007/09/04 Javascript
Javascript valueOf 使用方法
2008/12/28 Javascript
juqery 学习之五 文档处理 插入
2011/02/11 Javascript
利用jQuery操作对象数组的实现代码
2011/04/27 Javascript
Javascript判断对象是否相等实现代码
2013/03/18 Javascript
JavaScript让Textarea支持tab按键的方法
2015/06/26 Javascript
jquery实现无刷新验证码的简单实例
2016/05/19 Javascript
JS实现密码框的显示密码和隐藏密码功能示例
2016/12/26 Javascript
Vue中如何实现轮播图的示例代码
2017/07/27 Javascript
浅析vue-router jquery和params传参(接收参数)$router $route的区别
2018/08/03 jQuery
详解vue 图片上传功能
2019/04/30 Javascript
详解微信小程序「渲染层网络层错误」的解决方法
2021/01/06 Javascript
[03:39]2015国际邀请赛主赛事首日精彩回顾
2015/08/05 DOTA
python实现自动网页截图并裁剪图片
2018/07/30 Python
Python简单读写Xls格式文档的方法示例
2018/08/17 Python
使用Django连接Mysql数据库步骤
2019/01/15 Python
python实现知乎高颜值图片爬取
2019/08/12 Python
详解Django配置优化方法
2019/11/18 Python
python实现简单学生信息管理系统
2020/04/09 Python
怎样在程序里获得一个空指针
2015/01/24 面试题
班组长安全职责
2014/01/05 职场文书
社区党员公开承诺书
2014/08/30 职场文书
初三学生语文考试作弊检讨书
2014/12/14 职场文书
清洁工工作总结
2015/08/11 职场文书
辞职信怎么写?
2019/05/21 职场文书
解决Golang中ResponseWriter的一个坑
2021/04/27 Golang