带有 JQuery 的 Rails 5：带有显示和隐藏 JQuery 切换的表单最初会显示，但在我刷新页面后会隐藏起来

Question

我有一个帖子链接，它将向您显示 cmets，并允许您单击 div 以显示评论表单，同样，如果您单击取消，则隐藏表单。

当您点击帖子中的链接时，评论表单从打开位置开始，这是我不想要的。

但是，如果我只是刷新页面，它会重新加载视图，评论表单处于隐藏位置。我的 JQuery 技能很弱，我似乎无法弄清楚为什么它会在页面重新加载时起作用，但在来自另一个链接时不起作用。

这是我的评论表单：

# shared/_comment_form
<div id="comment-form" class="form-group">
  <%= form_for @comment, remote: true, url: post_comments_path(@post) do |f| %>
    <%= f.text_area :body, required: true, rows: 5, class: "form-control" %>
    <%= f.hidden_field :commentable_id, :value => @post.id %>
    <%= f.hidden_field :commentable_type, :value => @post.class.name %>
    <br>
    <%= f.submit class: "btn btn-primary" %>
  <% end %>
</div>
<span id="add-comment">Add a comment</span>

这是我的评论表单的 js.erb 文件

# comment_form.js.erb
$('#comment-form').hide().after('<%= j render("comment_form") %>');

我的 JQuery 将打开和关闭表单。

# app/assets/application.js
$( document ).ready(function() {
  $("#comment-form").hide();
  $('#add-comment').click( function() {
    $("#comment-form").fadeToggle("fast");
    ($("#add-comment").text() === "Cancel") ? $("#add-comment").text("Add comment") : $("#add-comment").text("Cancel");
  });
});

Answer 1

你也尝试过使用 css 吗？

#comment-form {
  display: hidden;
}