js事件绑定兼容处理方法。

最新推荐文章于 2022-08-30 15:08:59 发布

原创最新推荐文章于 2022-08-30 15:08:59 发布 · 359 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#javascript

javascript 专栏收录该内容

90 篇文章

订阅专栏

本文介绍了一个用于简化JavaScript事件处理的实用工具集，包括添加、移除事件监听器的方法，以及阻止默认事件行为和事件冒泡的功能实现。适用于不同浏览器环境。

代码来自《javascript高级程序设计》

var EventUtil = {
    //添加事件
    addHandler: function (element, type, handler) {
        if (element.addEventListener) {
            element.addEventListener(type, handler, false);
        } else if (element.attachEvent) {
            element.attachEvent("on" + type, handler);
        } else {
            element["on" + type] = handler;
        }
    },
    //移除事件
    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;
        }
    },
    //获取事件
    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;
        }
    },
    //阻止事件冒泡
    stopPropagation: function (event) {
        if (event.stopPropagation) {
            event.stopPropagation();
        } else {
            event.cancelBubble = true;
        }
    }
};