Web界面无人操作时触发事件 onNobodyEvent

灵感源于一个投射展示型项目,代码很简单并包含注释就不做累述了。

/*
* nobody.js
* @author Yimo
* @version v1.0
*/
(function(){
// 人为操作事件支持,以下事件触发将被认定为当前页面存在人为操作
var events = ['mousemove','keypress','mousedown','mousewheel'];

// 添加事件
function addEvent(type,handler){
if (window.addEventListener){
window.addEventListener(type, handler, false);
} else if (window.attachEvent){
window.attachEvent("on" + type, handler);
} else {
window["on" + type] = handler;
}
}

// 移除事件
function removeEvent(type,handler){
if (window.removeEventListener){
window.removeEventListener(type, handler, false);
} else if (window.detachEvent){
window.detachEvent("on" + type, handler);
} else {
window["on" + type] = null;
}
}
// 按ID缓存对应nobody事件的内部对象用于后续事件销毁
var cache = {};

/*
* 无人操作事件
*
* @param func 事件触发时的回调函数
* @param timeout 无人操作事件触发延迟时间
* @param onlyonce 是否仅触发一次
*
* @return 事件定时器ID
*/
window.onNobody = function(func,timeout,onlyonce){
// 域内独立对象,保证onNobody每次调用都有一个属于自己的detail对象
var detail = {
counter : 0,
lastTime : new Date().getTime(),
reset : function(){
detail.counter = 0;
}
}
for(var i = 0; i < events.length; i++){
addEvent(events[i],detail.reset);
};
var id = setInterval(function(){
if(detail.counter >= timeout){
func();
if(!onlyonce){
detail.counter = 0;
}else{
window.clearNobody(id);
}
}
var time = new Date().getTime();
detail.counter += time - detail.lastTime;
detail.lastTime = time;
},1);
cache[id] = detail;
return id;
}

/*
* 移除无人操作事件
*
* @param id 添加无人操作事件时返回的ID
*/
window.offNobody = function(id){
clearInterval(id);
for(var i = 0; i < events.length; i++){
removeEvent(events[i],cache[id].reset);
};
}
})();
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值