slideToggle多个div

Question

我有这段代码

＆＃13;

＆＃13;

jQuery(function ($) {

//After it toggle the content with this button
$('.content_toggle').hide();

$(".link-toggle").click(function () {
$(this).nextAll(".content_toggle").slideToggle("slow");
});


   });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<div class="link-toggle">Read more</div>
<div class="content_toggle">
  Hello world
 </div>

<div class="link-toggle">Read more again ?</div>
<div class="content_toggle">
  Another Hello world
 </div>

＆＃13;

＆＃13;

＆＃13;

我想逐个切换这些内容， 就像当我点击第一个div时，它的以下内容切换。 然后如果单击第二个div，则会切换以下内容。

不是两个在同一时间。

Answer 1

将你的nextAll更改为下一个，只针对紧随其后的课程而不是其下面的每个课程

$(this).next(".content_toggle").slideToggle("slow");

Answer 2

给他们ID并使用他们的ID来切换

jQuery(function ($) {

//After it toggle the content with this button, and use next instead of nextAll
$('.content_toggle').hide();

    $("#myfirstDiv").click(function () {
           $(this).next(".content_toggle").slideToggle("slow");
    });
    $("#mysecondDiv").click(function () {
           $(this).next(".content_toggle").slideToggle("slow");
    });



});

Answer 3

裹

<div>
    <div class="link-toggle">Read more</div>
    <div class="content_toggle">
      Hello world
    </div>
</div>

在<div>。

然后使用siblings方法：

$(".link-toggle").click(function () {
    $(this).siblings(".content_toggle").slideToggle("slow");
    });
});

Answer 4

请勿使用nextAll，只需使用next。

＆＃13;

＆＃13;

jQuery(function ($) {

//After it toggle the content with this button
$('.content_toggle').hide();

$(".link-toggle").click(function () {
$(this).next(".content_toggle").slideToggle("slow");
});


   });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<div class="link-toggle">Read more</div>
<div class="content_toggle">
  Hello world
 </div>

<div class="link-toggle">Read more again ?</div>
<div class="content_toggle">
  Another Hello world
 </div>

＆＃13;

＆＃13;

＆＃13;

Answer 5

这正是你所说的应该做的。这个“nextAll”将在所有后续兄弟姐妹中执行操作。请参阅doc：https://api.jquery.com/nextAll/

不要使用nextAll，而只是使用next，以获得所需的效果。