Question

伙计们正试图在fb上创建喜欢和不喜欢的按钮。我列出了我在PHP中循环的帖子列表。我只想要一个按钮，如果喜欢设置蓝色，如果不喜欢设置正常（默认）颜色。所有喜欢的记录都存储在db中 id | account_id | item_id |等。

我有一个用于喜欢的php控制器，它拥有2个主要方法 addAction（）和 deleteAction（）。第一个和第二个操作只接受ajax请求并在数据库中添加和删除记录。

所以我的问题是当我点击那个按钮颜色在ajax完成时没有改变（成功和完成）。我想我做得那么好，但方向错误。什么时候我点击喜欢记录已保存，但实时颜色已更改。我也尝试使用Jquery load（），但我只能加载所有帖子，在 setInterval 之后，他将我返回到帖子列表的顶部：/

这是我的jquery：

// Submit post like
submitPostLike: function() {

    var likes = 0;
    var likeBtn = $(".like-btn");

    likeBtn.click(function() {

         var postId = $(this).attr("rel");

        $.ajax({
             type: "post",
             cache: false,
             url: baseurl + "/like/addAction",
             data: {
                 item_id: postId,
             },
             success: function(response) {
                 console.log("post liked -" + postId); // debug
             },
            complete: function() {
                $(".like-txt").css("color", "blue");
                setTimeout(Post.updatePostList(), 1000);
                console.log("scheduler fired"); // debug
            },
             error: function(response, s, e) {
                alert(response.responseText);
             },
         });
     })
},

删除操作是我没有提到的。

在php中循环创建的Html

<?php if(hasLiked($post->post_id, $acc_id)): ?>
     <button type="button" id="post_like_btn" rel="<?= $post->post_id;?>" class="dislike-btn btn btn-xs btn-default">
     <div class="like-txt"><i class="glyphicon glyphicon-thumbs-up"></i> Like </div>
     </button>
<?php else : ?>
   <button type="button" id="post_dislike_btn" rel="<?= $post->post_id;?>" class="like-btn btn btn-xs btn-default">
  <i class="like glyphicon glyphicon-thumbs-up"></i> Dislike
  </button>
<?php endif; ?>

hasLiked（）是php函数，检查该帖子是否已经喜欢该帖子。如果在db show dislike按钮中存在类似帐户。

现在，如果有人喜欢发布，那么如何使用load（）函数进行实时刷新？这一切都有效，但只有当我刷新页面时，文字才是蓝色。

Answer 1

HTML正在服务器端处理并提供给客户端。如果hasLiked返回false，则带有类like-txt的div将不会出现在所提供的HTML中。因此，当您尝试在Ajax调用的complete方法中访问它时，没有任何反应。无论hasLiked返回的值是否为假，您都需要使元素存在于Dom中。你可以隐藏它，但它需要成为Dom的一部分。

Jquery ajax喜欢和不喜欢按钮

1 个答案: