在前端开发工作中,由于浏览器兼容性等问题,触发事件对象的方法不同,分为IE和非IE两种。下面主要介绍跨浏览器触发 目标事件、阻止事件的默认行为、阻止事件冒泡 三种方法:
var EventUtil = { target : function(e){ //目标事件 e = e || window.event; return e.target || e.srcElement; }, preventDefault : function(e){ //阻止事件的默认行为 e = e || window.event; if(e.preventDefault){ e.preventDefault(); }else{ e.returnValue = false; } }, stopPropagation : function(e){ //阻止事件冒泡 e = e || window.event; if(e.stopPropagation){ e.stopPropagation(); }else{ e.cancelBubble = true; } },
charCode : function(e){ //取得字符编码
e = e || window.event;
return e.keyCode || e.charCode;
}
};
以上代码,我们为EventUtil添加了3个方法,我们可以像下面这样使用这些方法:
var div=document.getElementById('div');
div.onclick = function(e){
var target = EventUtil.target(e); alert(target.tagName); }
document.onkeydown=function(e){
var code=EventUtil.charCode(e);
console.log(code); //按键盘上的键 看效果
}