1. 什么叫事件冒泡？
Jquery中的事件会按照DOM的层次结构像水泡一样不断向上直至顶端
《锋利的Jquery》中给出的例子如下：
1 <!DOCTYPE html> 2 <head></head> 3 <body> 4 <div id="content"> 5 outer div element 6 <span>inner div elements</span> 7 outer div elements 8 </div> 9 <div id="msg"></div> 10 <script type="text/javascript"> 11 $(function(){ 12 $(‘span‘).bind("click",function(){ 13 var txt = $(‘#msg‘).html()+"<p>inner span element clicked.</p>"; 14 $(‘#msg‘).html(txt); 15 }); 16 $(‘#content‘).bind("click", function(){ 17 var txt = $(‘#msg‘).html()+"<p>outer div element clicked.</p>"; 18 $(‘#msg‘).html(txt); 19 }); 20 }); 21 </script> 22 </body>
如上例，单击span元素会同时出发span.click 和 #content.click 两个事件
2. 引发的问题：
本来只想触发span的click事件，却同时出发了div和body的点击事件。所以，有必要对触发事件的对象做以限定。
2.1 事件对象：
绑定的事件时像function中传入event对象，使当点击某元素时，事件被创建，然后函数执行完毕后，事件对象被销毁，代码如下：
1 $("element").bind("click",function(event){ 2 /// 3 });
2.2 停止事件冒泡：
stopPropagation()
2.3 阻止默认行为：
preventDefault()
原文：http://www.cnblogs.com/ClaireLiu/p/6359107.html