??? 用網頁調整格式實在是太復雜了,湊合看看吧。。。。。
-
? 事件處理分為兩種,一種為冒泡型事件,另一種為捕獲型事件
? 冒泡型事件 :是從特定目標到最不特定的目標
? 捕獲型事件 :是從最不特定的對象開始觸發,一直到最精確的對象。
?
?DOM 標準同時支持兩種事件,并且捕獲型事件先發生。
?window-->document-->body-->div-->div-->body-->document-->window
?
? 比較特殊的,在 DOM 事件模型中,文本節點也會觸發事件,而 IE 中是不會的。
?window-->document-->body-->div-->text-->text-->div-->body-->document-->window
?
? -
IE 和 DOM 在事件及事件處理中有很多不一樣的。
-
? 對于加載監聽和移除監聽的語法
? 在 IE 中使用
??[Object].attachEvent("name_of_event_handler", fnHandler);
??[Object].detachEvent("name_of_event_handler", fnHandler);
? 兩個參數:要分配的事件處理函數的名字 和 事件處理函數
??[Object].attachEvent("onclick", fnHandler);
?? 與 [Object].onclick = fnHandler; 的作用是一樣的。
??
? 在 DOM 中使用
??[Obejct].addEventListener("name_of_event", fnHandler, bCapture);
??[Obejct].removeEventListener("name_of_event", fnHandler, bCapture);
? 三個參數: 1 :事件名稱。 2 :事件處理函數。 3 :用于冒泡階段( false )或者用于捕獲階段( true )。
??[Obejct].addEventListener("click", fnHandler, false);
?? 與 [Obejct].onclick = fnHandler; 的作用是一樣的。
??
? -
對于獲取目標的方法
? 在 IE 中
??var oTarget = oEvent.srcElement;
? 在 DOM 中
??var oTarget = oEvent.target;
??
?? -
對于獲取字符代碼
????在 IE 中
????? 如果按鍵代表一個字符(非 Shift 、 Ctrl 、 Alt 等),則 keyCode 將返回字符的代碼,即 Unicode 值。
在
DOM
中
??
???
??????
獲得字符代碼用
charCode?
var iCharCode = oEvent.charCode;
??
???
??????
獲得字符使用
??
?var sChar = String.fromCharCode(oEvent.charCode);
??
??????????
如果不確定按鍵是否包含字符,則使用
isChar
來判斷
???if(oEvent.isChar){
????var iCharCode = oEvent.charCode;
???}
?
?
-
阻止事件的默認行為 ( 比如阻止鼠標右鍵等 )
? 在 IE 中
??oEvent.returnValue = false;
? 在 DOM 中
??oEvent.preventDefault();
?
? -
停止事件冒泡
? 在 IE 中
??oEvent.cancelBubble = true;
? 在 DOM 中
??oEvent.stopPropagation();
IE 和 DOM 在事件及事件處理中有很多不一樣的。
把
IE
的
Event
事件統一成
DOM
的形式,創建
formatEvent
方法。建立
EventUtil
類
?
?
EventUtil.formatEvent = function (oEvent){ if(isIE){ oEvent.charCode = (oEvent.type == "keypress") ? oEvent.keyCode : 0; oEvent.eventPhase = 2; //代表冒泡階段,IE僅支持冒泡階段 oEvent.isChar = (oEvent.charCode > 0); oEvent.pageX = oEvent.clientX + document.body.scrollLeft; oEvent.pageY = oEvent.clientY + document.body.scrollTop; oEvent.preventDefault = function (){ this.returnvalue = false; } if(oEvent.type == "mouseout"){ oEvent.relatedTarget = oEvent.toElement; }else if(oEvent.type == "mouseover"){ oEvent.relatedTarget = oEvent.fromElement; } oEvent.stopPropagation = function (){ this.cancelBubble = true; } oEvent.target = oEvent.srcElement; oEvent.time = (new Date).getTime(); } return oEvent; }
?
?IE
與
DOM
的
event
獲取方法也不大一樣。特別說明的是函數的
caller
屬性。每個函數都有
caller
屬性,指向調用它的方法的引用。即,
funcA()
調用
funcB(),funcB.caller
就等于
funcA
?
EventUtil.getEvent = function(){ if(window.event){ return this.formatEvent(window.event); }else{ return EventUtil.getEvent.caller.arguments[0];//event對象總是事件處理函數的第一個參數。 } }
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
?
更多文章、技術交流、商務合作、聯系博主
微信掃碼或搜索:z360901061

微信掃一掃加我為好友
QQ號聯系: 360901061
您的支持是博主寫作最大的動力,如果您喜歡我的文章,感覺我的文章對您有幫助,請用微信掃描下面二維碼支持博主2元、5元、10元、20元等您想捐的金額吧,狠狠點擊下面給點支持吧,站長非常感激您!手機微信長按不能支付解決辦法:請將微信支付二維碼保存到相冊,切換到微信,然后點擊微信右上角掃一掃功能,選擇支付二維碼完成支付。
【本文對您有幫助就好】元
