封裝了一個支持匿名函數的Javascript事件監(jiān)聽器
更新時間:2014年06月05日 10:13:38 作者:
這篇文章主要介紹了支持匿名函數的Javascript事件監(jiān)聽封裝,需要的朋友可以參考下
關于js中的事件監(jiān)聽大家用的比較多了,無非是判斷瀏覽器是否支持addEventListener和attachEvent,網上搜索關于事件監(jiān)聽的方法也挺多,但是總有些不是很完善。下面的方法中對于添加事件監(jiān)聽的方法是一樣的,只不過在取消事件綁定上面做了點手術,現在可以支持匿名函數的使用,所以在綁定事件的時候不再需要給函數單獨命名了。
主要代碼:
復制代碼 代碼如下:
/*綁定事件與取消綁定*/
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['事件名稱']是一個數組,來添加多個事件監(jiān)聽的方法,unbind哪個事件的時候遍歷handleHash['事件名稱']的數組,然后移除。
使用:
復制代碼 代碼如下:
bind(obj,'click',function(){
alert ('click');
});
unbind(obj,'click');
相關文章
javascript 獲取url參數和script標簽中獲取url參數函數代碼
不要在方法中調用方法,否則可能始終獲取的是最后一個js的文件的參數,要在方法中使用,請先用變量保存,在方法中直接獲取2010-01-01