PbootCMS攻略

PbootCMS列表页实现点赞功能

时间：2020-04-21 访问量：2466 赞()

点赞是内容内置了的一个功能，但是模板里面一般没有写出来，自己增加了一个。

html:引入cookie.js(如果没有请自行下载)

<script src="{pboot:sitetplpath}/js/jquery.cookie.js"></script>

html code：

<span class="float-right zan" data-id="[list:id]" data-likeslink="[list:likeslink]">
<i class="zan-text"></i>赞
<i class="fa fa-thumbs-up"></i>
(<i class="fa likes">[list:likes]</i>)
</span>

js:

 $('.zan').on('click',  //绑定事件
      function() {
          var id=$(this).data('id');
          if ($.cookie('likes_'+id)) {
            $(this).find(".zan-text").html("已点过赞！");  //已赞提示
                      } else {
            $(this).find('.likes').text(parseInt($(this).find('.likes').text())+1);  //点赞后刷新#support_number
        $(this).find(".zan-text").html("已点赞！");//已赞提示
        var likeslink=$(this).data('likeslink');
        var likes=parseInt($(this).find('.likes').text())
        $.ajax({
          url: likeslink,  //点赞链接,这个才有用
          data: {
            'likes': likes
          },
          success: function(data) {
              console.log(data);
},
          error: function(xhr, status, error) {
               console.log(error)
          }    
        });
        };
        setTimeout(function(){$(".zan-text").html("");}, 1000);
      })