jQuery的嵌套最低選擇

Question

我想效果基本show的「.SUB菜單」選擇所有的孩子在下面的代碼：

<div ID="browse_container"> 
    <div class="sub-menu">Root 
     <div class="sub-menu">▷ English</div> 
     <div class="sub-menu">▷ Maths 
      <div class="sub-menu">Year 1</div> 
      <div class="sub-menu">Year 2</div> 
     </div> 
     <div class="sub-menu">▷ Science</div> 
    </div> 
</div> 

我jQuery是：

$(document).ready(function() { 
    $('.sub-menu').live('click', function(){ 
     $(this).children().slideUp() 
    }) 
}); 

但這向上滑動「根「，因爲例如」english「的子項都是」Root「的子項。我可以告訴jquery選擇降低嵌套的「子項目」嗎？

Answer 1

$(document).ready(function() { 
    $('.sub-menu').on('click', function(event){ 
    event.stopPropagation(); 
    $(this).children().slideUp(); 
    }); 
}); 

Demo

您可以從停止的情況下「冒泡DOM樹，阻止任何父處理程序被通知的事件。」

現在，當您點擊Maths時，只有孩子們向上滑動。