JavaScript --- > 跨浏览器的事件对象

转载于 2019-03-01 21:20:11 发布 · 212 阅读

文章标签：

#兼容 #前端 #跨浏览器 #事件对象

JavaScript 专栏收录该内容

113 篇文章

订阅专栏

本文介绍了一个实用的JavaScript事件处理工具包，包括事件添加、移除、获取事件对象、阻止默认行为、停止事件传播等核心功能，适用于跨浏览器的事件处理需求。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

var EventUtil={
    
    addHandler: function(element, type, handler){  // 添加事件方法
        if (element.addEventListener){
            element.addEventListener(type, handler, false);  // 添加监听事件,第3个参数false代表:冒泡阶段
        } else if (element.attachEvent) {
            element.attachEvent("on" + type, handler);
        } else {
            element["on" + type] = handler;
        }
    },
    
    getEvent: function(event){  // 跨浏览器获取事件对象
        return event ? event : window.event;
    },
    
    getTarget: function(event){
        return event.target || event.srcElement;
    },
    
    preventDefault: function(event){
        if (event.preventDefault){
            event.preventDefault();
        } else {
            event.returnValue = false;
        }
    },
    
    removeHandler: function(element, type, handler) {   
        if (element.removeEventListener){
            element.removeEventListener(type, handler, false);
        } else if (element.detachEvent){
            element.detachEvent("on" + type, handler);
        } else { 
            element["on" + type] = null;
        }
    },
    
    stopPropagation: function(event){  
        if (event.stopPropagation){
            event.stopPropagation();
        } esle {
            event.cancelBubble = true;
        }
    }
};

摘自《JavaScript高级程序设》(第3版) P360