封装了一个支持匿名函数的Javascript事件监听器
2014-06-05 10:13
447 查看
关于js中的事件监听大家用的比较多了,无非是判断浏览器是否支持addEventListener和attachEvent,网上搜索关于事件监听的方法也挺多,但是总有些不是很完善。下面的方法中对于添加事件监听的方法是一样的,只不过在取消事件绑定上面做了点手术,现在可以支持匿名函数的使用,所以在绑定事件的时候不再需要给函数单独命名了。
主要代码:
/*绑定事件与取消绑定*/
var handleHash = {};
var bind = (function() {
if (window.addEventListener) {
return function(el, type, fn, capture) {
el.addEventListener(type, function(){
fn();
handleHash[type] = handleHash[type] || [];
handleHash[type].push(arguments.callee);
}, capture);
};
} else if (window.attachEvent) {
return function(el, type, fn, capture) {
el.attachEvent("on" + type, function(){
fn();
handleHash[type] = handleHash[type] || [];
handleHash[type].push(arguments.callee);
});
};
}
})();
var unbind = (function(){
if (window.addEventListener) {
return function(el, type ) {
if(handleHash[type]){
var i = 0, len = handleHash[type].length;
for (i; i<len ; i += 1){
el.removeEventListener(type, handleHash[type][i]);
}
};
};
} else if (window.attachEvent) {
return function(el, type) {
if(handleHash[type]){
var i = 0, len = handleHash[type].length;
for (i; i<len ; i += 1){
el.detachEvent("on" + type, handleHash[type][i]);
}
};
};
}
})();
原理解析:
handleHash做哈希表缓存事件的function,handleHash['事件名称']是一个数组,来添加多个事件监听的方法,unbind哪个事件的时候遍历handleHash['事件名称']的数组,然后移除。
使用:
bind(obj,'click',function(){
alert ('click');
});
unbind(obj,'click');
您可能感兴趣的文章:
相关文章推荐
- 封装了一个支持匿名函数的Javascript事件监听器
- 一个通用的事件监听函数,能支持匿名函数的使用
- Js事件监听封装(支持匿名函数)
- 前不久写的一个XMLHttpRequest封装类。加上了一个请求池,并可以添加多个事件监听器
- Javascript事件注册机制--同时支持三种事件模型的javascript(转)
- 封装了一个发邮件的dll,支持附件,HTML
- 一个AJAX自动完成功能的js封装源码[支持中文]第1/2页
- 自已封装了一个极其易用的加密解密类,支持DES、三重DES、Rijndael、RC2、MD5、以及非对称加密算法RSA
- 同时支持三种事件模型的javascript
- 发布一个支持JavaScript的串口调试工具(免费使用)
- [2008-04-09更新]一个JavaScript WEB日历控件,支持IE6,FireFox,原作者 小酒天ID:KimSoft
- 一个很好的javascript框架,prototype.js 1.4,很好的封装了ajax的应用。
- (原创)一个JavaScript Function Outliner插件 第四版本 支持内嵌javascript,且可以对javascript进行压缩
- 一个javascript小技巧:在webForm中接收回车后激发一个按钮的服务器端响应事件
- 支持IE和Firefox的鼠标滚轮事件JavaScript代码
- 一个支持多国语言的时间框架(javascript)
- asp.net 一个页面中有两个按钮,回车时判断相应哪个事件的方法!!(用javascript 控制)
- 编写了一个支持firefox和ie的javascript+xml进行数据分页的程序
- [20081226更新(加了日文版本支持)]一个JavaScript WEB日历控件,支持IE6,FireFox,可支持不同语言版本,目前支持中文简繁,英,日语
- 封装了一个发邮件的dll,支持附件,HTML