2016年12月27日 星期二

(js)Event模組的原型

function addEvent(element, type, handler) {
    // 检测handler是否有$$guid属性。如果没有,赋值为addEvent的guid属性,将addEvent的guid属性自增1
    // 假设handler没有$$guid属性,addEvent的guid为1,则经此判断,
    // handler会有一个$$guid属性,且值为1,而addEvent的guid属性值变成2
    if (!handler.$$guid)
        handler.$$guid = addEvent.guid++;
    // 检测element是否已经绑定过事件,如果没有绑定过,
    // 则默认设置为一个空对象,用于保存将要绑定的事件
    if (!element.events)
        element.events = {};
    // 获取已经绑定过的type类型的事件对象
    var handlers = element.events[type];
    // 如果还没有type类型的事件被绑定过,则设置该类型的事件为一个空对象,用于保存将要绑定的该类型的事件
    if (!handlers) {
        handlers = element.events[type] = {};
        /*
        if(element["on" + type]){
        handlers[0] = element["on" + type];
        }*/
    }
    //按照序号存进去
    handlers[handler.$$guid] = handler;

    //赋予一个全局事件处理函数来处理所有工作
    element["on" + type] = handleEvent;
}
// addEvent保存一个序号
addEvent.guid = 1;
// 移除事件
function removeEvent(element, type, handler) {
    // 如果element经过addEvent绑定过事件,并且也有type类型的事件
    if (element.events && element.events[type]) {
        // 删除element的type类型事件的handler处理器
        delete element.events[type][handler.$$guid];
    }
}
// 处理事件
function handleEvent(event) {
    // 默认返回值为true
    var returnValue = true;
    // 矫正事件对象event
    event = event || fixEvent(window.event);
    // 获取已绑定的type类型的处理器
    var handlers = this.events[event.type];
    // 遍历执行每一个处理器
    for (var i in handlers) {
        this.$$handleEvent = handlers[i];
        // 如果存在返回值为false的处理器,则设置返回值为false
        if (this.$$handleEvent(event) === false) {
            returnValue = false;
        }
    }
    // 返回处理结果
    return returnValue;
}