给页面元素添加事件同时阻止冒泡

最新推荐文章于 2023-01-02 22:56:45 发布

原创最新推荐文章于 2023-01-02 22:56:45 发布 · 217 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#IE #F# #浏览器

javascript 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一种解决跨浏览器事件兼容性问题的方法，并通过一个示例代码展示了如何为页面元素添加事件监听器同时阻止事件冒泡。适用于IE与Firefox等浏览器。

给页面元素添加事件时，我们需考虑浏览器的兼容问题，因为 addEventListener 只在 FF 中适用，而 attachEvent 只在 IE 中适用，同时冒泡事件也类似。

以下代码实现了 IE 与 FF 的兼容，在给页面元素添加事件的同时，阻止了冒泡。

var addEvent = function(o,event,func){
	var f = function(){};
	if(window.event){
		f = function(){
			func(window.event);
			window.event.stopPropagation();
		}
	}else{
		f = function(e){
			func(e);
			e.cancelBubble = true;
		}
	}
	if(o.addEventListener){
		o.addEventListener(event,f,false);
	}else if(o.attachEvent){
		o.attachEvent("on"+event,f);
	}else{
		o["on"+event] = f;
	}
}