使用javascript的“委托”实现attachEvent

使用javascript的“委托”实现attachEvent

上次介绍过使用js来实现委托的特性，今天说一下使用委托实现一些有用的功能。
例如实现类似ie dom对象的其中一个方法：attachEvent
attachEvent这个方法是用来绑定对象事件，在大量使用互交时的中经常会用到这个方法，不过在ie和firefox是使用不同的方法来实现,我们可以使用委托来重写这个方法:

/**
 * function: 用委托的思想实现对象的事件绑定
 * author:   天边一只雁
 * blog:     http://harrychen66.cnblogs.com/
 */
// 实现委托的类
function delegate(func){
    this.arr = new Array(); // 回调函数数组
    this.add = function(func){
        this.arr[this.arr.length] = func;
    };
    this.run = function(){
        for(var i=0;i<this.arr.length;i++){
            var func = this.arr[i];
            if(typeof func == "function"){
                func(); // 遍历所有方法以及调用
            }
        }
    }
    this.add(func);
}
// 新建一个实现attach event的函数
function fAttachEvent(obj,sEvent,func){
    if(!obj.dEv) obj.dEv = new delegate();
    obj.dEv.add(func);
    eval("obj." + sEvent + " = function(){this.dEv.run()}");
}
// 建立一个button
var btn = document.createElement("BUTTON");
btn.value = "action";
// 绑定函数1
var renderButton = function(){
    document.body.appendChild(btn);
};
// 绑定函数2
var action1 = function(){
    alert("action1");
};
// 绑定函数3
var action2 = function(){
    alert("action2");
};
// 绑定函数1到window对象的onload事件
fAttachEvent(window, "onload", renderButton);
// 绑定函数2到btn对象的onclick事件
fAttachEvent(btn, "onclick", action1);
// 绑定函数3到btn对象的onclick事件
fAttachEvent(btn, "onclick", action2);