使用JavaScript/Jquery在Ruby中显示具有相同id/类的表单

我想在我的web应用程序中有一个转发按钮。当我按下按钮时，我希望显示一个表单，以便将我自己的文本添加到tweet中

我实现了这个。然而，我有一个问题：我所有的表单和按钮都包含相同的id和类，因此您可以想象，当我按下一个按钮时，它将显示具有该id/类的第一个表单，而不是它必须显示的表单。如何显示必须显示的表单

以下仅是包含retweet部分的代码部分（我认为其他部分对问题并不重要，但如果有人想让我发布，我可以发布它们）：

转发
“转发表单”}）do | f |%>

而JS：

 <script type="text/javascript">
 $(document).ready(function() {

 $('.retweet_form').hide(); //Initially form wil be hidden.

  $('#retweet-button').click(function() {
   $('.retweet_form').show();//Form shows on button click

   });
 });


</script>

$（文档）.ready（函数（）{
$（'.retweet_form'）.hide（）；//初始表单将被隐藏。
$（“#转发按钮”）。单击（函数（）{
$（'.retweet_form'）.show（）；//单击按钮时显示表单
});
});

---

当按下某个按钮时，如何显示必须显示的表单？（我想我必须为每个按钮和表单使用不同的ID，但如何使用？

正如我从代码中理解的那样，每个tweet使用一个按钮/表单对。所以，您可以使用tweet ID生成表单ID。要将按钮连接到适当的表单，请使用

data-*

字段

在Rails侧生成表单和按钮（注意：语法高亮显示已断开）：

 <script type="text/javascript">
 $(document).ready(function() {

 $('.retweet_form').hide(); //Initially form wil be hidden.

  $('#retweet-button').click(function() {
   $('.retweet_form').show();//Form shows on button click

   });
 });


</script>

<button type="button" class="retweet-button" data-target-form-id="<%= "#retweet-form-#{tweet.id}" %>">retweet</button>
  <%= form_for(current_user.tweets.build,url: retweet_act_path, method: :post, html: { multipart: true, :class => "retweet_form", id: "retweet-form-#{tweet.id}" }) do |f| %>
  <%= f.hidden_field :original_tweet_id, value: tweet.id %>
  <%= f.text_area :content, placeholder: "Add a message to the tweet..." %> 
  <%= f.submit "Retweet"%>
  <% end %>

$('.retweet_form').hide();
$('.retweet-button').click(function() {
  var formId = $(this).data('target-form-id');
  $(formId).show();
});