如果乙個節點和它的乙個父節點都繫結了相同事件型別的**,當事件觸發時哪個**會先執行?儘管網景和微軟的處理方式不一致,也不要太過擔心。
netscape 4 支援事件捕捉( capturing ),從頂層的父節點開始觸發事件,從外到內傳播。
微軟則支援事件冒泡( bubbling ),從最內層的節點開始觸發事件,逐級冒泡直到頂層節點,從內向外傳播。
我認為事件冒泡看起來更合理一些,這也是我們日常開發所用的事件模型。w3c 對此做了讓步,將對這兩種事件模型的支援都加入標準規範之中。根據 w3c 模型,事件首先被目標元素所捕捉,然後向上冒泡。
你 可 以 自 行 選 擇 要 注 冊 的 事 件 處 理 程 序 的 調 用 類 型, 捕 捉 或 冒 泡, 通 過 給addeventlistener() 傳入第 3 個引數 usecapture 來設定。如果 addeventlistener() 的最後乙個引數是 true ,事件處理程式以捕捉模式觸發 ;如果是 false ,事件處理程式以冒泡模式觸發 :
button.addeventlistener("click", function(), false); // 給最後乙個引數傳入 false,來設定事件冒泡
大多數情況下我們都在使用冒泡模式,如果對此不太確定,可以給 addeventlistener()的最後乙個引數傳入 false 。
當事件冒泡時,可以通過 stoppropagation() 函式來終止冒泡,這個函式是 event 物件中的方法。比如這段**,任何父節點的事件**都不會觸發 :
button.addeventlistener("click", function
(e),
false);
此外,一些類庫比如 jquery 還支援 stopimmediatepropagation() 函式,用來阻止後續所有的事件觸發——哪怕這些事件是註冊在同乙個節點元素上的也不例外。瀏覽器同樣給事件賦予了預設行為。比如,當你點選乙個鏈結時,瀏覽器的預設行為是載入新頁面,當點選乙個核取方塊時,瀏覽器會將其選中(或取消選中)。在事件傳播階段(之後)會觸發這些預設行為,在任何乙個事件處理程式中都可以阻止預設行為。可以通過呼叫 event 物件的 preventdefault() 函式來阻止預設行為,同樣也可以通過在**中返回 false 來實現同樣的效果 :
bform.addeventlistener("submit", function
(e),
false);
如果呼叫 confirm() 返回 false(使用者點選了對話方塊的取消按鈕),這個事件**函式就返回 false,這樣就會取消事件,阻止表單的提交。
事件冒泡和事件捕獲
事件冒泡 事件物件沿dom樹向上傳播 事件捕獲 事件物件沿dom樹向下傳播 addeventlistener click function flase 引數預設為false 代表事件冒泡，引數為true代表事件捕獲 attachevent onclick function detachevent 沒...
事件冒泡和事件捕獲
在js中，繫結的事件預設的執行時間是在冒泡階段執行，而非在捕獲階段 重要 這也是為什麼當父類和子類都繫結了某個事件，會先呼叫子類繫結的事件，後呼叫父類的事件。直接看下面例項 當點選id3元素時候，執行結果是 id2，id3，id1 解析 因為obj2與obj3繫結的方法在捕獲階段執行，obj1的事件...
事件冒泡和事件捕獲
物件導向 單列模式 工廠模式 建構函式 1 類 js天生自帶的類 object 基類 function array number math boolean date regexp string 1.事件 瀏覽器客戶端上客戶觸發的行為都稱為事件 所有的事件都是天生自帶的，不需要我們去繫結，只需要我們去...