tp5 ajax异步实现点赞取消点赞功能

引入layer

<script src="__HOME__/style/jquery-3.3.1.min.js" type="text/javascript"></script>
<script src="/layer/layer.js" type="text/javascript"></script>

1.前端代码

<span style=""><img src="__HOME__/images/li1.png" id="zan" alt="" style="height:76px;width: 70px;margin-left: -30px;"  /></span>

<script type="text/javascript">
    $(document).ready(function(){

        var str = window.location.href;
        var sta = str.lastIndexOf("/");
        var end = str.lastIndexOf(".");
        var artid = str.substring(sta+1,end);//返回url中的artid的值
        $('#zan').click(function(){
            if($('#session').text()==''){
                layer.alert('你还没有登录！', {icon: 5});
                return false;
            }
            var userid = parseInt($('.huoquid').attr('id'));
            var people = parseInt($('#peo').text());
            $.ajax({
                type:"post",
                dataType:"json",
                data:{userid:userid,artid:artid},
                url:"{:url('Article/dianzan')}",
                success:function(data){
                    if(data==1){
                        var lastzan = people+1;
                        $('#peo').text(lastzan);
                        $('#zan').attr('src','__HOME__/images/li2.png');
                        layer.alert('点赞成功！', {icon: 6});
                    }
                    if(data==2){
                        layer.alert('点赞失败！', {icon: 5});
                    }
                    if(data==3){
                        var lastzan = people-1;
                        $('#peo').text(lastzan);
                        $('#zan').attr('src','__HOME__/images/li1.png');
                        layer.alert('取消点赞成功！', {icon: 6});
                    }
                    if(data==4){
                        layer.alert('取消点赞失败！', {icon: 5});
                    }
                }
            });
        });
    });
</script>

2.后台代码

//点赞功能
public function dianzan()
{
    if(request()->isAjax()){
        $artid = input('artid');
        $userid = input('userid');
        $res = db('userzan')->where(array('artid'=>$artid,'userid'=>$userid))->field('zan')->find();
        if ($res==null) {   //之前没有点赞过
            $res1 = db('article')->where('id',$artid)->setInc('zan');
            $res2 = db('userzan')->insert(['artid'=>$artid,'userid'=>$userid,'zan'=>1]);
            if($res1&&$res2){
                return 1;
            }else{
                return 2;
            }
        }else{
            $res3 = db('userzan')->where(array('artid'=>$artid,'userid'=>$userid))->delete();
            $res4 = db('article')->where('id',$artid)->setDec('zan');
            if($res3&&$res4){
                return 3;
            }else{
                return 4;
            }
        }
    }
}