jquery:切换孩子onclick

m1k*_*3y3 1 javascript jquery onclick parent-child toggle

单击"+"时,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>
Run Code Online (Sandbox Code Playgroud)

Nic*_*ver 5

您可以使用.toggle().slideToggle()使用.siblings(),如下所示:

$("ul a:contains( + )").click(function() {
  $(this).siblings("ul").toggle();
});
Run Code Online (Sandbox Code Playgroud)

你可以在这里测试一下.请注意,虽然您的ID和属性无效,但您可能需要在此处使用data-属性.另外,我建议给这些+链接一个类,使选择更有效,例如:

<a href="#" class=".toggle"> + </a>
Run Code Online (Sandbox Code Playgroud)

然后像这样绑定:

$("ul a.toggle").click(function() {
  $(this).siblings("ul").toggle();
});
Run Code Online (Sandbox Code Playgroud)