用jQuery選擇所有的孩子和後代

Question

我有一個由WordPress插件生成的HTML，它被設計爲允許可擴展/可摺疊的文本，最多三層深度。我希望這樣，如果你要崩潰的第一或第二級和下面的孩子也擴大了也會崩潰，但我沒有使用似乎允許選擇所有孩子。這是我使用的是什麼至今：

$(".hidden-text-toggle").click(function() { 
    if ($(".hidden-text:animated").length) return false; 
     $(this).next().slideToggle(); 
     if ($(this).hasClass('expanded')){  
      $(this).removeClass('expanded'); 
      $(this).animate({ backgroundColor: "black" , color: "red"});  
     } 
     else 
     { 
      $(this).addClass('expanded'); 
      $(this).animate({backgroundColor: "red" , color: "black"}); 

     } 
     return false; 
    }); 

<div class="wrapper"> 
    <h2 class="title">Level One</h2> 
    <div class="text" href="#"> 
     This is level one text. 
     <div class="wrapper"> 
      <h2 class="title" href="#">Level Two</h2> 
      <div class="text"> 
       This is level two text. 
       <div class="wrapper"> 
        <h2 class="title" href="#">Level Three</h2> 
        <div class="text">       
         This is level three text. 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

我本來以爲把類似$(this).find(".text").slideUp(); 4號線之後將允許這一點，但顯然我錯了。

任何幫助將不勝感激！

Answer 1

你可以做毯子效果基本show每一個元素上（與find做這個組合）：

$("div.wrapper").find("div").slideUp(); 

注意，這是基本上是選擇每DIV根節點下，然後將每個的高度設置爲零。任何零高度的元素都不會受到影響。

Answer 2

嘗試：

$("h2.title").click(function() { 
    $(this).next().slideToggle(); 
});​ 

小提琴：http://jsfiddle.net/iambriansreed/amppK/

文檔：http://api.jquery.com/toggle-event/