js事件兼容处理

js封装事件处理函数，兼容ie，支持事件代理

var eventUtil = {
    bindEvent: function(el, type, target, callback, popgation) {
        /**
         * @author zhangtian
         * @date 2017/11/16
         * @desc 标准浏览器与ie事件兼容处理
         * @augments el:事件源 type事件类型 target事件代理元素 callback回调函数 popgation是否冒泡
         */
        var caption = caption || true; //默认为冒泡

        //如果不使用事件代理，target置空
        if((typeof target) == "function") {
            callback = target;
            target = null;
        }

        if(el.addEventListener) {
            el.addEventListener(type, function(e) {
                if(target) {
                    console.log("事件代理");
                    if(e.target == target) {
                        callback.call(target, e); //改变this指向，如果不用call，this指向window
                    }
                } else {
                    console.log("普通事件");
                    callback.call(el, e); //改变this指向，如果不用call，this指向window
                }
            }, popgation);
        } else if(el.attachEvent) {
            el.attachEvent("on" + type, function() {
                var e = window.event;
                if(target) {
                    console.log("事件代理");
                    if(e.srcElement == target) {
                        callback.call(target, e); //改变this指向，如果不用call，this指向window
                    }
                } else {
                    console.log("普通事件");
                    callback.call(el, e); //改变this指向，如果不用call，this指向window
                }
            });
        }
    },
    stopPropagation: function(e) {
        var event = e || window.event;
        if(event.stopPropagation) {
            event.stopPropagation();
        } else {
            event.cancelBubble = true;
        }
    },
    preventDefault: function(e) {
        var event = e || window.event;
        if(event.preventDefault) {
            event.preventDefault();
        } else {
            event.returnValue = false;
        }
    }
};

 

转载于:https://www.cnblogs.com/zt123123/p/7843567.html