※ 引述《etman395 (技術時代)》之銘言： : 或許我不該擅自決定那樣的事件補獲叫做繼承吧 : 就書上所講事件往子元素傳遞那樣叫事件補獲 : 而你說的情形是事件冒泡 : 必須要子元素和父元素都綁定同樣的事才會觸發 : 就是子元素li click之後連帶父元素的ul click事件也觸發 我一開始就想回 , 只是你的問題我看不太出來你想要做什麼所以就擱著了. 其實這個事件真的沒有這麼複雜 , 不需要特地區分為向下的捕獲或向上的 bubble , 這只是混淆自己認知而已... 總的來說 , 這其實都只有向上的傳遞 , 也就是所謂 bubble 效果 . 只是 , bubble 的主角是誰的問題 , 這會牽扯到為什麼你要怎麼解決. 讓我們先把層級拉出來 (sorry , 我現在比較懶得寫完整的html code , 底下是示意有看不懂的要說 , 我先假設讀者有基本html / jQuery event能力....) 先假設是這樣 body{ div{ ul{ li{ } } } } 假設是這樣的層級好了 . 今天的 bubble 的意思是說 , 我今天從哪個元素觸發( trigger ) , 它會一路往上觸發他的對應元素的父元件對應的事件 . 所以以你的命題 ul 來說 , 假設他定義了 click(function(){ alert("hi i am ul "); }); 這時候如果你去點擊(click) ul , 這時候他理所當然會跑出 hi i am ul , 那你的問題就是你現在點的明明就是 li , 為什麼也會出現 "hi i am ul" . 這很簡單啊 , 因為 li.click -> ul.click -> div.click -> body.click 這就是起點由li 開始的bubble 現象... 我們說 ul.click(function(e){ e.stopPropagation(); //直接複製的,平常都直接寫false... e.preventDefault(); //or return false; }); 這是說 他的流程會從 li.click -> ul.click -\-> 因為被阻止了 , 他的訊息不會再往上傳. 但是這對 li.click 上來想阻止他傳給ul.click 的事件是無效 , 因為根本就沒擋對...... XD . 所以你的問題在於說 , 你只有某特定元素(ex. ul)被點擊的時候 , 你才想執行 , 而且你認為只有 trigger 對象直接是指到該元素 , 而不是該元素的子元素(ex. li)時才進行事件的處理. 所謂event.target 指的是真正被點到的那個直接元素 , 如果是 li被 click , event.target 就是 li , if( li == this ){ // this是看event是由誰bind 就是誰 , 在這例子是ul //所以等同於 if(li==ul){} //do the thing you want } 所以在這樣的狀況下 , 當然只有 ul 被click 有效 . 其實嚴格來說還有另一個後遺症會比較多的解法 . $("ul *").click(function(){ return false; }); (竊笑) 至於為什麼這樣能解按照上面的邏輯應該是想的出來， 所謂的後遺症就是 <a> 這類靠click的事件完全都會被擋掉. -- 哦附帶一題 , <a> 的轉換網址事件是排在onclick之後的 , 轉換網址這個行為 , 其實也是 bubble 的效果. -- I am a person, and I am always thinking . Thinking in love , Thinking in life , Thinking in why , Thinking in worth. I can't believe any of what , I am just thinking then thinking , but worst of all , most of mine is thinking not actioning... --

※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 220.136.156.164 ※ 編輯: TonyQ 來自: 220.136.156.164 (12/06 15:50) ※ 編輯: TonyQ 來自: 220.136.156.164 (12/06 15:52)