JQuery 提供了两种方式来阻止事件冒泡。

方式一：event.stopPropagation();

$("#div1").mousedown(function(event){            event.stopPropagation();        });

 

方式二：return false;

$("#div1").mousedown(function(event){            return false;        });

但是这两种方式是有区别的。return false 不仅阻止了事件往上冒泡，而且阻止了事件本身。event.stopPropagation() 则只阻止事件往上冒泡，不阻止事件本身。

场景应用： Google 和 百度的联想框，当弹出下拉列表，用户在下拉列表区域按下鼠标时需要让光标仍然保持在文本输入框。

示例测试代码： 当文本输入框获取焦点后，在div1的mousedown事件中采用 event.stopPropagation(); 代码，我们鼠标单击红色区域后文本输入框光标失去。而当我们使用 return false; 代码时，鼠标单击红色区域光标仍然停留在文本输入框内。

     
         
     
        
      
       1.单击输入框，使输入框获取焦点：
      
        
              
      
            
       
        
        
2.然后再单击这里