Question

如果帖子上没有评论，我可以删除评论表单，但如果帖子上有评论，我就无法删除该表单。我不确定我做错了什么，尝试过几种不同的方式删除评论。我的代码如下，非常感谢任何帮助。

<article class="post">
  <div class="group">

    <div class="post-header-thumb">
      <a href="<%= user_url(post.user) %>">
        <img src="<%= post.user.profile_photo(:thumb) %>" alt="">
      </a>
    </div>

    <div class="post-user-info">
      <div class="name">
        <%= post.user.full_name %>
      </div>
      <div class="role">
        <!-- user.role_in_course -->
      </div>
      <div class="post-time">
        posted <%= time_ago_in_words(post.created_at) %> ago
      </div>
    </div>

    <% if post.user == current_user || post.course.has_write_permission?(current_user) %>

      <div class="post-controls">
        <div class="post-edit">
          <%= link_to "Edit", edit_post_url(post), id: "post-edit-#{post.id}", remote: true %>
        </div>

        <form 
          class="delete"
          id="post-delete-<%= post.id %>" 
          action="<%= post_url(post) %>" 
          method="POST"
          data-remote="true">

          <input
            type="hidden"
            name="authenticity_token"
            value="<%= form_authenticity_token %>">

          <input
            type="hidden"
            name="_method"
            value="DELETE">

          <input type="submit" class="post-delete" value="X">
        </form>
      </div>

    <% end %>
  </div>

  <p class="post-content">
    <%= post.body %>
  </p>

</article>

<% post.comments.each do |comment| %>
    <%= render comment %>
<% end %>

<form 
  class="comment-form"
  id="comment-form-<%= post.comments.size + 1 %>" 
  action="<%= post_comments_url(post) %>" 
  method="POST" 
  data-remote="true">

  <input
     name="authenticity_token"
     type="hidden"
     value="<%= form_authenticity_token %>">

  <fieldset class="comment-form-container">
    <textarea rows="1" cols="50" name="comment[body]" id="comment_body" placeholder="Comment here..."></textarea>
  </fieldset>

  <input type="hidden" name="comment[post_id]" value="<%= post.id %>">

  <div class="submit comment-submit">
    <input type="submit" class="comment-submit-button" value="Comment">
  </div>
</form>

<script>
  $(document).ready(function(event) {

    $("#post-edit-<%= post.id %>").on("ajax:success", function(event, data) {
      var $post = $(this).closest('.post');
      var $commentForm = $post.next('.comment-form')

      $post.parent().prepend(data);
      $commentForm.detach();
      $post.detach();
    });


    $("#post-delete-<%= post.id %>").on("ajax:success", function(event, data) {
        var $post = $(this).closest('.post');
        var $comments = $post.nextUntil('.comment-form');
        var $commentForm = $post.next('.comment-form');

        $post.remove();
        $comments.remove();
        $commentForm.remove();
    });
</script>

以下是评论存在与删除时某个帖子没有评论之间的差异：

不存在

--- $评论---

[prevObject：jQuery.fn.jQuery.init [1]，context：form＃post-delete-45.delete，jquery：“1.10.2”，constructor：function，init：function ...]

--- $ commentForm ---

[form＃comment-form-1.comment-form，prevObject：jQuery.fn.jQuery.init [1]，context：form＃post-delete-45.delete，jquery：“1.10.2”，constructor ：function，init：function ...]

PRESENT

--- $评论---

[article.comment，script，prevObject：jQuery.fn.jQuery.init [1]，context：form＃post-delete-44.delete，jquery：“1.10.2”，constructor：function，init：function ...]

--- $ commentForm ---

[prevObject：jQuery.fn.jQuery.init [1]，context：form＃post-delete-44.delete，jquery：“1.10.2”，constructor：function，init：function ...]

Answer 1

更改脚本

<script>
  $(document).ready(function(event) {

    $("#post-edit-"+<%= post.id.to_s %>).on("ajax:success", function(event, data) {
      var $post = $(this).closest('.post');
      var $commentForm = $post.next('.comment-form')

      $post.parent().prepend(data);
      $commentForm.detach();
      $post.detach();
    });


    $("#post-delete-"+<%= post.id.to_s %>).on("ajax:success", function(event, data) {
        var $post = $(this).closest('.post');
        var $comments = $post.nextUntil('.comment-form');
        var $commentForm = $post.next('.comment-form');

        $post.remove();
        $comments.remove();
        $commentForm.remove();
    });
</script>

Answer 2

这不起作用！

var $commentForm = $post.next('.comment-form');

尝试

var $commentForm = $comments.next();

删除帖子时无法从DOM中删除评论表单

2 个答案: