跨瀏覽器事件EventUtil

標籤：

<div style="width: 150px; height: 150px; padding: 25px; border:1px solid blue; " id="divBox"><p style="width: 100px; height: 100px; padding:25px; border:1px solid red; " id="pBox"><span style="width:50px; height:50px; border:1px solid gray; display: block;" id="spanBox">span</span></p></div>

var divBox = document.getElementById(‘divBox‘);var pBox = document.getElementById("pBox");var spanBox = document.getElementById("spanBox");function handler(event){var target = EventUtil.target(EventUtil.event(event));switch(target.id){case "divBox":alert("this is divBox...");break;case "pBox":alert("this is pBox");break;case "spanBox":alert("this is spanBox...");break;}}EventUtil = {addEventListener:function(ele,type,callback,capture){if(window.addEventListener){ele.addEventListener(type,callback,capture);}else if(window.attachEvent){ele.attachEvent("on"+type,callback);}else{ele["on"+type] = callback;}},removeEventListener:function(){if(window.removeEventListener){ele.removeEventListener(type,callback,capture);}else if(window.detachEvent){ele.detachEvent("on"+type,callback);}else{ele["on"+type] = null;}},event:function(event){return event = event || window.event;},target:function(event){var target = event.target || event.srcElement;return target;},preventDefault:function(event){if(event.preventDefault){event.preventDefault();}else{event.returnValue = false;}}}EventUtil.addEventListener(divBox,"click",handler,false);

以上是本人自己寫的，不是很全面，更全面的版本參考以下網址：

http://blog.csdn.net/guoyz_1/article/details/5521008

跨瀏覽器事件EventUtil