在触发DOM上的某个事件的时候,会产生一个事件对象event,这个对象包含着所有与事件有关的信息,包括导致事件的元素、事件类型等,所有的浏览器都支持event对象,但支持方式不同。
(只有在事件处理程序执行期间,event对象才会存在,一旦执行完成就会别销毁)
(1)DOM中的事件对象
var btn = document.getElementById('btn');
btn.onclick = function(e){
alert(e.type);
}
几个常用的属性:
bubbles:表明事件是否冒泡
cancelable:是否可以取消事件的默认行为
currentTarget:事件处理程序当前正在处理事件的默认行为
eventPhase:调用事件处理程序的阶段1-捕获,2-处于目标,3-冒泡
preventDefault:取消事件的默认行为
stopPropagation:取消事件的捕获或者冒泡
target:事件的目标
(2)IE中的事件对象
btn.onclick = function(){
var event = window.event;
alert(event.type);
}
but,,如果事件处理程序是使用attachEvent()添加的,则
btn.attachEvent('onclick',function(e){
alert(e.type);
});
它的常用方法:
cancelBubble:默认值为false,事件冒泡,true,取消事件冒泡
srcElement:事件的目标
returnValue:默认为true,false为取消默认行为
type:事件类型
(3)跨浏览器的事件对象
getEvent:
function(e){
return e?e:window.event;
},
getTarget:
function(e){
return e.target || e.srcElement;
},
preventDefault:
function(e){
if(e.preventDefault){
e.preventDefault();
}else{
e.returnValue = false;
}
},
stopPropagation:
function(e){
if(e.stopPropagation){
e.stopPropagation();
}else{
e.cancelBubble = true;
}
}