实现“喜欢”功能的问题.函数只工作一次

Issue with implementing likes functionality. Function works only once

本文关键字：工作 一次 函数 喜欢 功能 问题 实现      更新时间：2023-09-26

喜欢或不喜欢函数只工作一次，如果"喜欢"变量不再是真或假，这将是有效的值。第一次运行良好(喜欢和不喜欢)，但第二次出现"else"警告，这对我来说是绝对不清楚的。你能解释一下哪里出了问题吗?当我通过alert检查时，html中的Bool被正确更新。

HTML与少量django模板代码，不要注意:

<div class="incriminate_like" data-post-pk="{{ answer.pk }} " data-who-likes-id="{{ request.user.id }} " >
<div class="data_div" data-bool="false">
<img  class="like_image" src="{% static "img/like.png" %}"/>
</div>
</div>
JQUERY: 

 $('.incriminate_like').click(function(){
  var post_pk = $(this).data("post-pk");
  var who_likes_id = $(this).data("who-likes-id");
  var that = $(this);
  var liked = $(this).find(".data_div").data("bool");
  function makeLiked(){
              that.find("img").attr("src","{% static 'img/likered.png' %}");
              that.find(".data_div").data("bool","true");
               // just incriminating 
              var like_number_original = that.next().html();
              var integer_of_like_number_original = parseInt(like_number_original);
              var plus_one_number = integer_of_like_number_original + 1
              that.next().html(plus_one_number);
              }
  function makeDisliked(){
              that.find("img").attr("src","{% static 'img/like.png' %}");
              that.find(".data_div").data("bool","false");
              // just incriminating 
              var like_number_original = that.next().html();
              var integer_of_like_number_original = parseInt(like_number_original);
              var plus_one_number = integer_of_like_number_original - 1
              that.next().html(plus_one_number);

    }
    if (liked == false) {
                          ajaxPost('/like/', {'post_pk': post_pk,'who_likes_id':who_likes_id,'whom_id':whom_id}, function(){
                          makeLiked();

                                                                                                                           })
                         }

    else if (liked == true ) {
                    ajaxPost('/dislike/', {'post_pk': post_pk,'who_likes_id':who_likes_id,'whom_id':whom_id}, function(){
                    makeDisliked();

                                                                                                                        })


                             }

    else {
                      alert('error');
        }
                                  })

问题是，如果调用makeLiked()或makedislike()，则将data-bool值设置为string，因此这就是为什么liked == true(甚至liked == false)返回false。试着这样设置:

that.find(".data_div").data("bool", true);

(注意第二个参数没有")

所以最后的代码应该是这样的: 
$('.incriminate_like').click(function() {
  var post_pk = $(this).data("post-pk");
  var who_likes_id = $(this).data("who-likes-id");
  var that = $(this);
  var liked = $(this).find(".data_div").data("bool");
  function makeLiked() {
    that.find("img").attr("src", "{% static 'img/likered.png' %}");
    that.find(".data_div").data("bool", true);
    // just incriminating 
    var like_number_original = that.next().html();
    var integer_of_like_number_original = parseInt(like_number_original);
    var plus_one_number = integer_of_like_number_original + 1
    that.next().html(plus_one_number);
  }
  function makeDisliked() {
    that.find("img").attr("src", "{% static 'img/like.png' %}");
    that.find(".data_div").data("bool", false);
    // just incriminating 
    var like_number_original = that.next().html();
    var integer_of_like_number_original = parseInt(like_number_original);
    var plus_one_number = integer_of_like_number_original - 1
    that.next().html(plus_one_number);

  }
  if (liked == false) {
    ajaxPost('/like/', {
      'post_pk': post_pk,
      'who_likes_id': who_likes_id,
      'whom_id': whom_id
    }, function() {
      makeLiked();

    })
  } else if (liked == true) {
    ajaxPost('/dislike/', {
      'post_pk': post_pk,
      'who_likes_id': who_likes_id,
      'whom_id': whom_id
    }, function() {
      makeDisliked();

    })


  } else {
    alert('error');
  }
})
相关文章：