一、冒泡事件简介

当我们点击一个控件的时候，如果包括这个控件的父控件也有click事件，则会继续执行。

方法一：event.stopPropagation( );

例如：

 

    
         
     
段落文本内容         
 
    

html代码：

 

// 为所有div元素绑定click事件$("div").click( function(event){ alert("div-click"); } ); //为所有p元素绑定click事件 $("p").click( function(event){ alert("p-click"); } ); //为所有button元素绑定click事件 $(":button").click( function(event){ alert("button-click"); // 阻止事件冒泡到DOM树上 event.stopPropagation(); // 只执行button的click，如果注释掉该行，将执行button、p和div的click } );

方法二：event.target

eventevent.targetDOM API .targetDOMthisDOM $(document).ready(function(){

 $('#switcher').click(function(event){

  $('#switcher .button').toggleClass('hidden');

  })

 })

  

$(document).ready(function(){

 $('#switcher').click(function(event){

  if(event.target==this){

  $('#switcher .button').toggleClass('hidden');

  }

  })

 })

<div id="switcher">  。