Javascript 铁路及；JS：使面板由生成。每个函数独立切换

我一次只能有一个下拉列表。问题是我在使用一个。每个功能。因此，我不知道如何使每个下拉列表都有一个特定的id或类，以便使我的

。在每个下拉列表上分别单击
函数

这是我的嵌入式ruby文件：

<% @companies.each do |company| %>
<div class="panel panel-primary">
  <div class="panel-heading show_hide_panel"></div>
  <div class="panel-body panel">
   ....
  </div>
</div>
<%end%>

我的问题：如何使.each生成的每个面板独立地打开，而不是在只单击一个面板时同时打开

多谢各位。如果我不够清楚，请告诉我。
JQuery有办法做到这一点。基本上，您可以通过在函数中使用
$（this）
来获取单击的元素

在您的特定情况下，您正在单击
面板标题
，因此它在函数中变为
$（this）
。要打开
面板主体
，请选择其同级
$（this）.sides（'.panel body'）。slideToggle（）
。
完整代码：

$(document).on("click",".panel-heading", function () {

         $(this).siblings('.panel-body').slideToggle();
    });

JQuery有一种方法可以做到这一点。基本上，您可以通过在函数中使用
$（this）
来获取单击的元素

在您的特定情况下，您正在单击
面板标题
，因此它在函数中变为
$（this）
。要打开
面板主体
，请选择其同级
$（this）.sides（'.panel body'）。slideToggle（）
。
完整代码：

$(document).on("click",".panel-heading", function () {

         $(this).siblings('.panel-body').slideToggle();
    });

您应该使用id而不是类。也许在迭代中使用索引作为id？您应该使用id而不是类。也许在迭代中使用索引作为id？“this”的问题是我没有切换它，而是切换“this”中的一个项。有办法做到这一点吗？请尝试使用$（this）.children（“.panel body”）.slideToggle（）；或者不管里面物品的标识符是什么，这似乎对我不起作用。因为面板主体不是标题.$（document）.on（“click”，“.panel primary”，function（）{}）的子对象；应该有用。或者，更好的方法是使用console.log（$（this））查看您实际单击的内容并告诉我。如果是面板标题，您可以将.children（'.panel body'）替换为.sildren（'.panel body'），“this”的问题是我没有切换此项，而是切换“this”中的一项。有办法做到这一点吗？请尝试使用$（this）.children（“.panel body”）.slideToggle（）；或者不管里面物品的标识符是什么，这似乎对我不起作用。因为面板主体不是标题.$（document）.on（“click”，“.panel primary”，function（）{}）的子对象；应该有用。或者，更好的方法是使用console.log（$（this））查看您实际单击的内容并告诉我。如果它是面板标题，您可以将.children（'.panel body'）替换为.sibbins（'.panel body'）
$(".show_hide_panel").click(function(){
  $(this).closest(".panel-primary").find(".panel-body").slideToggle();
});