Javascript 在循环中生成元素时，如何指定哪个容器？

我正在显示按发件人分组的邮件列表

我还将在每组消息之后显示一个表单，以便回复特定的发件人

<% @grouped_messages.each do |sender, messages| %>

 <% messages.each do |msg| %>
  <p><%= msg.content %></p>
 <% end %>

 <div class="reply-container", id='reply-container'>
 <%= form_for @message do |f| %>
  <%= f.text_field :content %>
  <%= f.submit "Reply" %>
 <% end %>
 </div>

 <%= link_to "Reply", '#', class: 'reply-link', id: 'reply-link' %>
<% end %>

这不起作用，因为页面上只能有一个id，并且所有回复容器都具有相同的id

---

在循环中动态生成元素时，如何指定要隐藏的容器？

您可以尝试以下操作：

$(".reply-link").click(function(e){
  e.preventDefault();
  $(this).closest( '.reply-container').toggle();
  $(this).toggle();
});

您可以删除ID：“回复链接”和“回复容器”

编辑： 但你可以做得更好：

 <div class="reply-container", id="reply-sender-#{sender.id}-container">
 <%= form_for @message do |f| %>
  <%= f.text_field :content %>
  <%= f.submit "Reply" %>
 <% end %>
 </div>

 <%= link_to "Reply", '#', class: 'reply-link', id: "reply-sender-#{sender.id}" %>

编辑：

您还应将组划分为div：

<% @grouped_messages.each do |sender, messages| %>
 <div class='message_group'>

   <% messages.each do |msg| %>
    <p><%= msg.content %></p>
   <% end %>

   <div class="reply-container", id='reply-container'>
   <%= form_for @message do |f| %>
    <%= f.text_field :content %>
    <%= f.submit "Reply" %>
   <% end %>
   </div>

   <%= link_to "Reply", '#', class: 'reply-link', id: 'reply-link' %>
  </div>
<% end %> 

谢谢。我试过了，但是回复容器没有出现。但是回复链接消失了。我已经检查了回复容器的拼写，似乎一切正常。它似乎没有找到最近的元素。我现在得到错误：TypeError:this.attr不是一个函数$（this.attr（“id”）+“-container”）.toggle（）；这是面试问题吗？面试是什么意思？我正在做一个项目，意思是我昨天的回答几乎相同，所以看起来这可能是公司面试过程的一部分如果是的话就可以了，只是好奇的问题。在我尝试添加元素之前没有。现在我正在尝试切换一个表单。我不擅长javascript，所以我需要很多帮助。啊，那是你！对不起，我没有注意到。：）我现在的问题是：为什么你有两个表单提交按钮和额外的回复链接？谢谢，但它们都出现和消失了

$(".reply-link").click(function(e){
  e.preventDefault();
  $("#" + $(this).attr("id") + "-container").toggle();
  $(this).toggle();
});

$(".reply-link").click(function(e){
  e.preventDefault();
  $(this).siblings('.reply-container').toggle();
  $(this).toggle();
});

<% @grouped_messages.each do |sender, messages| %>
 <div class='message_group'>

   <% messages.each do |msg| %>
    <p><%= msg.content %></p>
   <% end %>

   <div class="reply-container", id='reply-container'>
   <%= form_for @message do |f| %>
    <%= f.text_field :content %>
    <%= f.submit "Reply" %>
   <% end %>
   </div>

   <%= link_to "Reply", '#', class: 'reply-link', id: 'reply-link' %>
  </div>
<% end %>