jQuery AJAX POST()实现微博点赞
2015-09-09 14:37:38 小德 PHP 访问次数 1542

关于Ajax :在不重载整个网页的情况下,AJAX 通过后台加载数据,并在网页上进行显示。这对于与服务器交换数据,提供了很好的方式,极大提升用户体验。

关于

jQuery 提供多个与 AJAX 有关的方法。通过 jQuery AJAX 方法,能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本、HTML、XML 或 JSON - 同时您能够把这些外部数据直接载入网页的被选元素中。

$.post() 方法通过 HTTP POST 请求从服务器上请求数据。

语法:

$.post(URL,data,callback);

必需的 URL 参数规定您希望请求的 URL。

可选的 data 参数规定连同请求发送的数据。

可选的 callback 参数是请求成功后所执行的函数名。

我们用POST实现微博点赞:

PHP服务端点赞function:

    public function prize()
    {
        $tb_list = M('blog');
        $map['id'] = I('id');
        $result = $tb_list->where($map)->find();
        $result['prize_times']++;
        $tb_list->where($map)->save($result);
        echo json_encode($result['prize_times']);
        // echo json_encode($result);
    }

webHTML页面:

    <a class="btn btn-sm btn-primary zan" aim="{$vo.id}" >赞(<?php echo $vo['prize_times']; ?>)</a>//点赞按钮,按钮显示赞(获得赞的次数)
<script>
$(document).ready(function(){
    $(".zan").click(function(){
        var id = $(this).attr('aim'); //获取当前点击对象 aim属性值
        var obj = $(this);
        // ajax post请求
        $.post("__CONTROLLER__/prize",
            {"id":id},
            function(data){
                // console.log(data);
                // alert("数据:" + data);
                obj.html('赞('+data+')');
                // obj.html('赞('+data.prize_times+')');//回调函数,html(),给指定的标签填写内容
            },
            'json'
        );
    });
});
</script>