Question

我一次只能在下拉列表中遇到问题。问题是我正在使用.each fucntion。因此，我不知道如何制作它，以便每个下拉列表都有一个特定的id或类，以使我的.click函数在每个下拉列表中单独运行。

这是我的嵌入式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%>

这就是我所拥有的JS：

$(".panel").hide();

$(".show_hide_panel").click(function(){
  $(".panel").slideToggle();
});

我的问题：我怎样才能使每个面板（由the.each生成）单独点击切换，而不是只在点击一个面板时立即切换。

谢谢。如果我不够清楚，请告诉我。

Answer 1

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

在您的特定情况下，您点击了panel-header，使其在功能中变为$(this)。您想要打开panel-body，以便选择其兄弟$(this).siblings('.panel-body').slideToggle()。完整代码：

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

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

Answer 2

$(".show_hide_panel").click(function(){
  $(this).closest(".panel-primary").find(".panel-body").slideToggle();
});

Rails＆amp; JS：使.each函数生成的面板独立切换

2 个答案: