jquery中什麼是事件冒泡

冒泡事件就是，事件發生後，瀏覽器通常首先觸發事件發生元素上的事件處理程序，然後是它的父元素，父元素的父元素…依此類推， 直到文檔的根元素為止。冒泡事件是事件傳播的最常見的方式；當處理好一個事件後，如果想要停止事件的傳播，不希望它繼續冒泡，就要綁定該事件的處理方法。

本教學操作環境：windows7系統、jquery3.6.1版本、Dell G3電腦。

什麼是事件冒泡

冒泡事件就是，如果在某一個物件上觸發某一類別事件，那麼該事件會向父級傳播，並觸發父物件上定義的同類事件。事件傳播的方向是從最底層到最頂層，類似水泡從水底浮上來一般。

一個HTML文件可以視覺化一個DOM樹：

#那麼事件冒泡現象就可以形象的表示為下圖:

簡單來說：

事件發生後，瀏覽器通常會先觸發事件發生元素上的事件處理程序，然後是它的父元素，父元素的父元素… …。依此類推， 直到文件的根元素為止。

這被稱為事件冒泡，是事件傳播的最常見的方式。 當處理好一個事件後， 你可能想要停止事件的傳播，不希望它繼續冒泡。就要綁定該事件的處理方法。

如上圖，給他們都設定一個點擊事件，當點擊button時即觸發button的點擊事件時則會觸發對應的父元素div發生點擊事件，再觸發body發生觸發事件，以此類推直至document或window為止。

冒泡舉例說明

程式：

阻止冒泡的方法：

jquery阻止事件起泡實例

$("form").bind(
　　"submit", 
　　function() { 
　　　　return false;
　　 }
);

$("form").bind(
　　"submit", 
　　function(event){
　　　　　　event.preventDefault();　　
　　}
);

$("form").bind(
　　"submit", 
　　function(event){
　　　　　　event.stopPropagation();　　
　　}
);

jQuery影片教學、web前端影片】

以上是jquery中什麼是事件冒泡的詳細內容。更多資訊請關注PHP中文網其他相關文章！