python - 当用户喜欢评论回复时，为什么我没有得到正确的按钮

Question

我正在一个网站上工作，用户可以在其中评论帖子，其他用户也可以回复帖子的评论并喜欢每条评论。我已经实现了评论和点赞部分，但是当用户点赞评论回复时，右侧图标不显示（红色心形）。我正在使用 heart 作为按钮，就像 instagram 一样。当我单击空心按钮时，它会获取数据库中的值，但空心不会变为红心。此问题仅出现在评论回复中。

注意：在我附上的图片上，红色的心是我的评论，效果很好。但是空心是评论回复之类的，点击后计数为1，但心没有变成红色，我如何让心变成红色？这就是我想要的解决方案。

模型：

def comment_like_view(request):
    # post = get_object_or_404(Comments, id=request.POST.get('comment_id'))
    comment = get_object_or_404(Comments, id=request.POST.get('id'))
    comment.liked_comment = False
    if comment.likes.filter(id=request.user.id).exists():
        comment.likes.remove(request.user.profile)
        comment.liked_comment = False
    else:
        comment.likes.add(request.user.profile)
        comment.liked_comment = True

    context = {'comment': comment}

    if request.is_ajax():
        html = render_to_string('ajax_commentlikes.html', context, request=request)
        return JsonResponse({'form': html})

意见：

def comment_like_view(request):
    # post = get_object_or_404(Comments, id=request.POST.get('comment_id'))
    comment = get_object_or_404(Comments, id=request.POST.get('id'))
    comment.liked_comment = False
    if comment.likes.filter(id=request.user.id).exists():
        comment.likes.remove(request.user.profile)
        comment.liked_comment = False
    else:
        comment.likes.add(request.user.profile)
        comment.liked_comment = True

    context = {'comment': comment}

    if request.is_ajax():
        html = render_to_string('ajax_commentlikes.html', context, request=request)
        return JsonResponse({'form': html})

评论.html：

{% for reply in comment.replies.all %}
<h6 class="comment editcomment-text ml-5">
{{ reply.comment_post }}
</h6>
<li id="user-comment">
<span class="commentlikes">{% include 'ajax_commentreplylikes.html' %}</span>
</li>
{% endfor %}

ajax_commentreplylike.html：

<form action="{% url 'site:comment_like' %}" method="POST" id="user-comment{{ reply.id }}">
      {% csrf_token %}
      {% if reply.liked_comment %}
      <button type="submit" name="comment_id" value="{{ reply.id }}" class="like-comment animated fadeIn" style="background:none;border:none;box-shadow:none;outline:none;cursor:pointer;">
      <img src="{{ '/static/' }}images/heartred24px.png" width="12" height="12">
      </button>

      {% if reply.likes.all|length > 999 %}
      <a href="{% url 'site:comment_likes_users' reply.id %}">
      <span class="dark-grey-text animated fadeIn" style="font-size:10px;font-weight:500;position:relative;left:-3px;">
      {{ reply.likes.count|human_format }}</span>
      </a>
      {% else %}
      <a href="{% url 'site:comment_likes_users' reply.id %}">
      <span class="dark-grey-text animated fadeIn" style="font-size:10px;font-weight:500;position:relative;left:-3px;">
      {{ reply.likes.count }}</span>
      </a>
      {% endif %}

      {% else %}
      <button type="submit" name="comment_id" value="{{ reply.id }}" class="like-comment" style="background:none;border:none;box-shadow:none;outline:none;cursor:pointer;">
         <img src="{{ '/static/' }}images/heart24px.png" width="12" height="12" alt="like">
       </button>

       {% if reply.likes.all|length > 999 %}
      <a href="{% url 'site:comment_likes_users' reply.id %}">
      <span class="dark-grey-text animated fadeIn">
      {{ reply.likes.count|human_format }}</span>
      </a>
      {% else %}
      <a href="{% url 'site:comment_likes_users' reply.id %}">
      <span class="dark-grey-text animated fadeIn">
      {{ reply.likes.count }}</span>
      </a>
      {% endif %}        
      {% endif %}
  </form> 

查询：

<script type="text/javascript">
  //LIKE USER COMMENT AND REPLY
  $(document).on('click', '.like-comment', function(event){
  event.preventDefault();
  var pk = $(this).attr('value');
  $.ajax({
    type: 'POST',
    url: "{% url 'site:comment_like' %}",
    headers: { 'X-CSRFToken': $('input[name=csrfmiddlewaretoken]').val() },
    data: {'id':pk},
    dataType: 'json',
    success: function(response) {
      $('#user-comment'+pk).html(response['form'])
      console.log($('#user-comment'+pk).html(response['form']));
    },
    error: function(rs, e) {
      console.log(rs.resopnseText);
   },
   });
  });
</script>

标签： pythonjquerydjango