1. 事件目標

現(xiàn)在，事件處理程序中的變量event保存著事件對象。而event.target屬性保存著發(fā)生事件的目標元素。這個屬性是DOM API中規(guī)定的，但是沒有被所有瀏覽器實現(xiàn) 。jQuery對這個事件對象進行了必要的擴展，從而在任何瀏覽器中都能夠使用這個屬性。通過.target，可以確定DOM中首先接收到事件的元素（即實際被單擊的元素）。而且，我們知道this引用的是處理事件的DOM元素，所以可以編寫下列代碼：
代碼如下:
$(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"> ，而不是其他后代元素?，F(xiàn)在，單擊按鈕不會再折疊樣式轉(zhuǎn)換器，而單擊邊框則會觸發(fā)折疊操作。但是，單擊標簽同樣什么也不會發(fā)生，因為它也是一個后代元素。實際上，我們可以不把檢查代碼放在這里，而是通過修改按鈕的行為來達到目標 。

2. 停止事件傳播

事件對象還提供了一個.stopPropagation()方法，該方法可以完全阻止事件冒泡。與.target類似，這個方法也是一種純JavaScript特性，但在跨瀏覽器的環(huán)境中則無法安全地使用 。不過，只要我們通過jQuery來注冊所有的事件處理程序，就可以放心地使用這個方法。
下面，我們會刪除剛才添加的檢查語句event.target == this，并在按鈕的單擊處理程序中添加一些代碼：

代碼如下:
$(document).ready(function(){
 $('#switcher .button').click(funtion(event){
  //……
   event.stopPropagation();
  })
 })

  同以前一樣，需要為用作單擊處理程序的函數(shù)添加一個參數(shù)，以便訪問事件對象。然后，通過簡單地調(diào)用event.stopPropagation()就可以避免其他所有DOM元素響應這個事件。這樣一來，單擊按鈕的事件會被按鈕處理，而且只會被按鈕處理。單擊樣式轉(zhuǎn)換器的其他地方則可以折疊和擴展整個區(qū)域。

3. 默認操作

如果我們把單擊事件處理程序注冊到一個錨元素，而不是一個外層的<div>上，那么就要面對另外一個問題：當用戶單擊鏈接時，瀏覽器會加載一個新頁面。這種行為與我們討論的事件處理程序不是同一個概念，它是單擊錨元素的默認操作。類似地，當用戶在編輯完表單后按下回車鍵時，會觸發(fā)表單的submit事件，在此事件發(fā)生后，表單提交才會真正發(fā)生。
如果我們不希望執(zhí)行這種默認操作，那么在事件對象上調(diào)用.stopPropagation()方法也無濟于事，因為默認操作不是在正常的事件傳播流中發(fā)生的。在這種情況下，.preventDefault()方法則可以在觸發(fā)默認操作之前終止事件 。