Jquery事件冒泡

事件冒泡

什么是事件冒泡?
在一個對象上觸發某類事件（比如單擊onclick事件），如果此對象定義了此事件的處理程序，那么此事件就會調用這個處理程序，如果沒有定義此事件處理程序或者事件返回true，那么這個事件會向這個對象的父級對象傳播，從里到外，直至它被處理（父級對象所有同類事件都將被激活），或者它到達了對象層次的最頂層，即document對象（有些瀏覽器是window）。

事件冒泡的作用?
事件冒泡允許多個操作被集中處理（把事件處理器添加到一個父級元素上，避免把事件處理器添加到多個子級元素上），它還可以讓你在對象層的不同級別捕獲事件。

阻止事件冒泡?
事件冒泡機制有時候是不需要的，需要阻止掉，通過 event.stopPropagation() 來阻止

$(function(){var $box1 = $('.father');var $box2 = $('.son');var $box3 = $('.grandson');$box1.click(function() {alert('father');});$box2.click(function() {alert('son');});$box3.click(function(event) {alert('grandson');event.stopPropagation();});$(document).click(function(event) {alert('grandfather');});
})......<div class="father"><div class="son"><div class="grandson"></div></div>
</div>

?

阻止默認行為?
阻止右鍵菜單

$(document).contextmenu(function(event) {event.preventDefault();
});

?

合并阻止操作?
實際開發中，一般把阻止冒泡和阻止默認行為合并起來寫，合并寫法可以用

// event.stopPropagation();
// event.preventDefault();// 合并寫法：
return false;

?