Question

每当用户点击#bu id时，我想向下滑动（或向上）所有＃bu2 id。但是，当我点击#bu时，只显示“First”。代码：

$("#bu2").slideToggle("slow");

<li class="sliding-element" id="bu">clickMe</li>
                <li class="sliding-element" id="bu2" style="display:none;">First</li> 
                <li class="sliding-element" id="bu2" style="display:none;">Second</li> 
                <li class="sliding-element" id="bu2" style="display:none;">Third</li>

我认识到我需要一个循环。然后，我试过了 $未来（ “＃BU2”）的slideToggle（ “慢”）。但它没有解决它。如何使用id向上或向下滑动，不包括过程中的“滑动元素”类，并将“Second”和“Third”声明为不同的ID？
谢谢

Answer 1

您不应该有多个具有相同ID的元素。

试试这个：

$(".bu2").slideToggle("slow");

<li class="sliding-element" id="bu">clickMe</li>
<li class="sliding-element bu2" style="display:none;">First</li> 
<li class="sliding-element bu2" style="display:none;">Second</li> 
<li class="sliding-element bu2" style="display:none;">Third</li>

如果你想在一个ul中滑动所有'li'元素，那么：

$("ul#foo li").slideToggle("slow");        

<ul id="foo">
  <li>First</li>
  <li>Second</li>
</ul>

Answer 2

将类用于非独特的事物。此外<li>只能进入<ul> s

$("#bu").click(function(){
    $('.bu2').slideToggle("slow");
})

<ul class="sliding-element" id="bu">clickMe
    <li class="sliding-element bu2" style="display:none;">First</li> 
    <li class="sliding-element bu2" style="display:none;">Second</li> 
    <li class="sliding-element bu2" style="display:none;">Third</li>
</ul>

滑动切换多个ID

2 个答案: