带有JQuery的Rails 5:带有显示和隐藏JQuery切换的表单最初会显示，但在刷新页面后会像应该那样隐藏

Question

我有一个帖子链接，它将显示您的评论，并允许您单击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;
}