JS事件監聽詳解


一、DOM.addEventListener(事件類型,事件回調函數)

給DOM元素添加一個事件監聽,只能收到對應事件類型的消息,收到這個消息時,執行事件回調函數

 

function   事件回調函數(e){

}

1、事件回調函數有且僅有一個參數e;

2、e是一個事件對象,偵聽事件收到消息時獲得的事件對象;

3、事件函數不能寫return返回值,但是可以用return跳出;

二、事件的偵聽和拋發(自定義事件需要向document拋發)

紅的框里的兩處必須一摸一樣;

三、事件傳遞(將obj2中的c中的參數傳入到obj1中的b中)

 

四、事件的三個階段(捕獲,目標,冒泡)

div.addEventListener(事件類型,事件回調函數,是否捕獲時執行)

e.stopPtopagation()   停止冒泡;

e.cancelBubble=true;       IE8及以下的停止冒泡;

1事件類型:必須是字符串,可以設為任意字符串,但部分字符串是系統事件類型;

2、事件回調函數:指向一個函數,當收到事件時執行函數,若沒有收到,則不執行,寫偵聽事件時不執行;

3、是否捕獲時執行:默認值是false,在冒泡時執行,捕獲時不執行,若將false設為true,在捕獲時執行;

五、事件監聽和刪除;

div.removeEventListener(“事件類型”,事件的回調函數);

 IE8及以下,div.detachEvent(on+事件類型,事件的回調函數)

六、事件偵聽的區別

1、addEventListener:  IE8以上支持,事件類型是type,有捕獲,冒泡階段選項;

2、attachEvent:   僅支持IE8及以下,事件類型是on+type,無捕獲,冒泡階段選項;

3、onclick=函數,任何瀏覽器都支持,

缺點:同一個事件不能執行多個函數,沒有捕獲冒泡階段選項,僅是冒泡階段,使用的匿名函數,也會造成多個事件不能執行同一個函數;

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM