日期:2014-05-16  浏览次数:20458 次

javascript事件委托
<ul id="ul">
	<li id="li1">dododo</li>
	<li id="li2">dododo</li>
	<li id="li3">dododo</li>
</ul>

?如果想对多个li对象进行事件侦听,这时候用事件委托是不二的选择了。事件委托就是利用了事件冒泡,对document中某一个元素进行侦听,其实也就是侦听了其下的所有子元素。

javascript代码如下:

var EventUtil = {
	addEvent: function(node, type, listener) {
		if (node.addEventListener) {
			node.addEventListener(type, listener, false); //firefox
		} else {
			node.attachEvent("on"+type, listener); //ie
		}},
	getTarget: function(event){
		return event.target || event.srcElement;
		/**
		在ie下是用event.srcElement,firefox下用event.target
		*/
	}	
}

var node = document.getElementById("ul");
	
EventUtil.addEvent(node,"click",function(event){
	alert(EventUtil.getTarget(event).id);
});

?当鼠标单击li元素时,会弹出显示当前li id的警告框,以上代码在ie8, firefox5测试通过