事件监听中的问题

看到zhenn在BLOG里提到的一个关于监听中THIS的问题，感觉很好，一般我们的监听解决方案如下：

function bindEvent(elem,type,fn){

    if(elem.attachEvent){

        elem.attachEvent(“on”+type,fn);

    }else{

        elem.addEventListener(type,fn,false);

    }

}

//调用

bindEvent(obj,”click”,fn1);

bindEvent(obj,”click”,fn2);

bindEvent(obj,”mouseover”,function(){alert(this)})   //this->window

但此时THIS一直指向WINDOW,所以我们也会

1. function bindEvent(elem,type,fn){
2.     if(elem.attachEvent){
3.         elem.attachEvent(“on”+type,function(){
4.             fn.apply(elem,arguments);
5.         });
6.     }else{
7.         elem.addEventListener(type,fn,false);
8.     }
9. }
10. bindEvent(obj,”mouseover”,function(){alert(this)})  //this->elem

但是还有一个问题亟待解决，因为在attachEvent中使用了匿名函数来执行fn，导致在无法使用detachEvent来删除绑定的某个代码片段，也许obj["on"+type] = null可以解决，清空绑定的代码片段，这很粗暴邪恶，同时也违背我们的业务需求。

zhenn的方案

1. //绑定事件
2. function bindEvent(elem,type,fn){
3.     if(elem.attachEvent){
4.         var typeRef = ”_” + type;
5.         if(!elem[typeRef]){
6.             elem[typeRef] = [];
7.         }
8.         for(var i in elem[typeRef]){
9.             if(elem[typeRef][i] == fn){
10.                 return;
11.             }
12.         }
13.         elem[typeRef].push(fn);
14.         elem["on"+type] = function(){
15.             for(var i in this[typeRef]){
16.                 this[typeRef][i].apply(this,arguments);
17.             }
18.         }   
19.     }else{
20.         elem.addEventListener(type,fn,false);
21.     }
22. }
23.  
24. //移除事件绑定
25. function removeEvent(elem,type,fn){
26.     if(elem.detachEvent){
27.         if(elem["_"+type]){
28.             for(var i in elem["_"+type]){
29.                 if(elem["_"+type][i] == fn){
30.                     elem["_"+type].splice(i,1);
31.                     break;
32.                 }
33.             }
34.         }
35.     }else{
36.         elem.removeEventListener(type,fn,false);
37.     }
38. }