Question

如何在JavaScript中使用自定义事件

Answer 1

// 自定义事件对象
// 用于自定义事件绑定、触发、删除
var Event = {
    eventMap: {},
    addEventListener: function (eventName, handler, target, args) {
        var T = this;
        if (!T.eventMap[eventName]) {
            T.eventMap[eventName] = [];
        }
        target = target || T;
        args = args || [];
        T.eventMap[eventName].push({handler: handler, target: target, args: args});
        return T;
    },
    removeEventListener: function (eventName, handler) {
        var T = this,
            i,
            len,
            item;
        if (handler) {
            for (i = 0; i < len; i++) {
                item = T.eventMap[eventName][i];
                if (item.handler === handler) {
                    item = null;
                }
            }
        } else {
            T.eventMap[eventName] = [];
        }
        return T;
    },
    dispatch: function (eventName, e) {
        var T = this,
            i,
            len,
            item,
            map = T.eventMap[eventName];
        if (map) {
            len = map.length;
        }
        e = e || {};
        for (i = 0; i < len; i++) {
            item = map[i];
            if (item) {
                item.args.unshift(e);
                item.handler.apply(item.target, item.args);
            }
        }
    }
}

// 调用事件绑定
Event.addEventListener(name, function (e, name, callback) {});
// 触发事件
Event.dispatch(name, name);