jquery：切換兒童onclick

Question

什麼js/jquery的代碼會使下面列表切換孩子點擊「+」時？

<ul> 
<li id="1" parent="0"><a href="#">1</a></li> 
    <li id="2" parent="0"><a href="#"> + </a><a href="#">2</a> 
     <ul parent="2"> 
      <li id="23" parent="2"><a href="#">2.1</a></li> 
      <li id="50" parent="2"><a href="#"> + </a><a href="#">2.2</a> 
       <ul parent="50"> 
        <li id="123" parent="50"><a href="#">2.50.1</a></li> 
       </ul> 
      </li> 
     </ul> 
    </li> 
</ul> 

Answer 1

您可以使用.toggle()或.slideToggle()與.siblings()，像這樣：

$("ul a:contains(+)").click(function() { 
    $(this).siblings("ul").toggle(); 
}); 

You can test it out here。請注意，雖然您的ID和屬性無效，但您可能需要在此處使用data- attributes。另外，我建議給那些+鏈接類，使選擇多更有效，例如：

<a href="#" class=".toggle"> + </a> 

然後結合這樣的：

$("ul a.toggle").click(function() { 
    $(this).siblings("ul").toggle(); 
}); 

Answer 2

像這樣的事情

$("ul a:contains('+')").click(function() { 
    var $this = $(this); 
    $this.siblings("ul").show(); 
});