jQuery如何防止這種冒泡事件發生_jquery

冒泡事件就是點擊子節點，事件會向上傳遞，最後觸發父節點，祖先節點的點擊事件。

html程式碼部分：

複製程式碼 程式碼如下:

   

        外層div元素
        內層span元素
        外層div元素
   

   

jQuery程式碼如下：

複製程式碼 程式碼如下:

當點擊span時，會觸發div與body 的點擊事件。點擊div時會觸發body的點擊事件。

如何防止這種冒泡事件發生呢？修改如下：

複製程式碼 程式碼如下:

        有時候點選提交按鈕會有一些預設事件。例如跳到別的介面。但是如果沒有通過驗證，就不應該跳轉。這時候可以透過設定event.preventDefault(); 來阻止預設行為。以下是案例：

複製程式碼 程式碼如下:

html部分：

複製程式碼 程式碼如下:

   

    使用者名稱：

   
   

   

還有一個防止預設行為的方法就是return false。效果一樣。程式碼如下：

複製程式碼 程式碼如下:

同理，上面的冒泡事件也可以透過return false來處理。

複製程式碼 程式碼如下:

jQuery對DOM的事件觸發具有冒泡特性。有時利用這項特性可以減少重複程式碼，但有時候我們又不希望事件冒泡。這時候就要阻止 jQuery.Event冒泡。