一、事件流
事件流描述的是從頁面中接受事件的順序。
IE的事件流是事件冒泡流,而Netscape的事件流是事件捕獲流
跨瀏覽器的事件處理程序
var eventUtil = {
//添加句柄
addHandle: function(element, type, handle) {
if (element.addEventListener) {
element.addEventListener(type, handle, false);
} else if (element.attachEvent) {
element.attachEvent("on" + type, handle);
} else {
element["on" + type] = handle;
};
},
//刪除句柄
removeHandle: function(element, type, handle) {
if (element.removeEventListener) {
element.removeEventListener(type, handle, false);
} else if (element.dettachEvent) {
element.dettachEvent("on" + type, handle);
} else {
element["on" + type] = null;
};
},
// 阻止冒泡
noBubble: function() {
if (event && event.stopPropagation) {
event.stopPropagation();
console.log('notIe');
} else {
window.event.cancelBuble = true;
console.log('ie');
}
},
// 阻止元素默認行爲
noPrevent: function() {
if (event && event.preventDefault) {
event.preventDefault();
console.log('notIe');
} else {
// console.log(event.preventDefault);
window.event.returnValue = false;
console.log('ie');
}
}
}
//調用
eventUtil.addHandle(element,"click",Fun);
1. DOM中的事件對象
(1)、type:獲取事件類型
(2)、target:事件目標
(3)、stopPropagation() 阻止事件冒泡
(4)、preventDefault() 阻止事件的默認行爲
2. IE中的事件對象
(1)、type:獲取事件類型
(2)、srcElement:事件目標
(3)、cancelBubble=true阻止事件冒泡
(4)、returnValue=false阻止事件的默認行爲
參考文檔:
簡書-JS事件探祕