自定义事件处理函数

解决了传统事件处理函数的覆盖问题、可读性问题、this传递问题

 1 //添加时间函数
 2 function addEvent(obj,type,fn){            //obj相当于window，type相当于onload，fn相当于function(){};
 3     var saved = null;            //用于保存上一个事件
 4     if (typeof obj[‘on‘ + type] == ‘function‘) {        //用于判断事件是否存在
 5         saved = obj[‘on‘ + type];        //保存上一个事件
 6     }
 7
 8      obj[‘on‘ + type] = function(){
 9          if (saved) saved();
10          fn.call(this);            //把this传过去，传统onclick会自动传
11      };
12 }
13
14 //移除事件函数
15
16 function removeEvent(obj,type){
17     if (obj[‘on‘ + type]) obj[‘on‘ + type] = null;
18 }
19
20
21 //事件切换器
22 addEvent(window,‘load‘,function(){
23     var box = document.getElementById("box");
24     addEvent(box,‘click‘,toBlue);
25 });
26
27     function toBlue(){
28         this.className = "blue";
29         removeEvent(this,‘click‘);
30         addEvent(this,‘click‘,toRed);
31     }
32
33     function toRed(){
34         this.className = "red";
35         removeEvent(this,‘click‘);
36         addEvent(this,‘click‘,toBlue);
37     }