Js冒泡機制是指如果某元素定義了事件A，如click事件，如果觸發了事件之後，沒有阻止冒泡事件，那麼事件將向父級元素傳播，觸發父類的click函數。
如下例所示：
複製代碼代碼如下:
<html>
<script type="text/javascript" src="jquery-1.7.1.js"></script>
<script>
function ialertdouble(e) {
alert('innerdouble');
stopBubble(e);
}
function ialertthree(e) {
alert('innerthree');
stopBubbleDouble(e);
}
function stopBubble(e) {
var evt = e||window.event;
evt.stopPropagation?evt.stopPropagation():(evt.cancelBubble=true);//阻止冒泡
}
function stopBubbleDouble(e) {
var evt = e||window.event;
evt.stopPropagation?evt.stopPropagation():(evt.cancelBubble=true);//阻止冒泡
evt.preventDefault();//阻止瀏覽器默認行為，這樣鏈接就不會跳轉
}
$(function() {
//方法一
//$('#jquerytest').click(function(event) {
// alert('innerfour');
// event.stopPropagation();
// event.preventDefault();
//});
//方法二
$('#jquerytest').click(function() {
alert('innerfour');
return false;
});
});
</script>
<div onclick="alert('without');">without
<div onclick="alert('middle');">middle
<div onclick="alert('inner');">inner</div>
<div onclick="ialertdouble(event)">innerdouble</div>
<p><a href='http://www.baidu.com' onclick="ialertthree(event)">innerthree</a></p>
<p id='jquerytest'><a href='http://www.baidu.com'>innerfour</a></p>
</div>
</div>
</html>
當你點擊inner的時候，會依次彈出'inner'，'middle'和'without'。這就是事件冒泡。
從直觀上來看，也是這樣的，因為最裡層的區域是在父級節點中的，點擊了子級節點的區域，其實也是點擊了父級節點的區域，所以事件會傳播起來。
其實，很多的時候，我們並不想事件冒泡，因為這樣會同時觸發幾個事件。
接下來：我們點擊innerdouble。就會發現她並沒有冒泡，因為她在調用的方法ialertdouble()中調用了stopBubble()方法，方法通過判斷瀏覽器類型（Ie通過cancleBubble() 、firefox通過stopProgation()）來阻止冒泡。
但如果是鏈接的話，我們會發現她也會阻止冒泡，但是會跳轉，這就是瀏覽器的默認行為。需要藉助preventDefault()方法來阻止。具體可以查看ialertthree()。
目前主流的都是藉助jquery來綁定click事件的，這樣的話，就簡單多了。
我們可以在點擊事件時傳入參數event，然後直接
event.stopPropagation();
event.preventDefault(); //沒有鏈接不需要加這個。
這樣就可以了。
框架就是好，其實還有更簡單的，在事件處理程序中返回false，這是對在事件對像上同時調用stopPropagation()和preventDefault()的一種簡寫方式。
【詳細代碼見上面，記得載入jquery.js。 】
其實也還可以在每個click事件中加入判斷：
複製代碼代碼如下:
$('#id').click(function(event){
if(event.target==this){
//do something
}
})
解析：事件處理程序中的變量event保存著事件對象。而event.target屬性保存著發生事件的目標元素。這個屬性是DOM API中規定的，但是沒有被所有瀏覽器實現。 jQuery對這個事件對象進行了必要的擴展，從而在任何瀏覽器中都能夠使用這個屬性。通過.target，可以確定DOM中首先接收到事件的元素（即實際被單擊的元素）。而且，我們知道this引用的是處理事件的DOM元素，所以可以編寫以上代碼。
不過推薦使用return false，Jquery綁定事件的話。