使用jQuery折叠单个字段集

Question

我制作了一个可折叠的字段集，但我在同一页面上有多个字段集，当我点击一个字段集时，它会折叠所有字段集，但我只希望它只折叠我点击的字段集，我已经放了必要的代码到Jsbin： Click here

由于

$(document).ready(function () {
  $(".leg").click(function () {
    $("div.proj").toggle();
  });
});

Answer 1

那是因为您选择了.proj类的所有元素，您可以使用引用您当前点击元素的this。

$(document).ready(function() {
    $(".leg").click(function() {
        $(this).next().toggle();
    });
});

• next()

Answer 2

您设置的jQuery会将当前点击应用于所有字段集，因为您要为每个字段集请求$("div.proj")。

你应该使用

$( this ).parent().find( '.proj' ).toggle();

Answer 3

你可以试试这个

$(document).ready(function () {
     $(".leg").click(function () {              
         $(this).parent().children("div").toggle();
     });
});