php+ajax实现分页

效果图

<p id="list"> </p>
<p id="pagecount"></p>
<script type="text/javascript">

       getData(1);
       var curPage = 1; //当前页码
       var total,pageSize,totalPage; //总记录数，每页显示数，总页数

        //获取数据
       function getData(pUserSerial,num,page){

            $.ajax({
                type: 'POST',
                 url: "__MODULE__/Payment/getLog/",
                data: {'pUserSerial':pUserSerial,'num':1,'pageNum':page-1},
                dataType:'json',
                 beforeSend:function(){
                     //$("#list ul").append("<li id='loading'>loading...</li>");//显示加载动画
                 },
                success:function(data){
                    switch(data.result){
                        case 1:
                            if(data.info){
                                $("#list_2").empty();//清空数据区
                                total    = data.total; //总记录数
                                pageSize  = data.pageSize; //每页显示条数
                                curPage  = page; //当前页
                                totalPage = data.totalPage; //总页数
                                var str  = "<ul>";
                                var info  = data.info;
                                var str  = '';
                                for(var i=0;i<data.info.length;i++){
                                    str+='<td>'+data.info[i]['id']+'</td>';
                                    str+='<td>'+data.info[i]['pStartMoney']+'</td>';
                                    str+='</tr>';
                                 }
                                $("#list_2").html(str);
                                }
                                break;
                        case 0:
                            layer.msg("参数错误!");
                            break;
                        }
                    },
                complete:function(){ //生成分页条
                                getPageBar();
                                //当点击分页条中的分页链接时，调用getData(page)加载对应页码的数据。                                     $("#pagecount span a").on('click',function(){
                                        var rel = $(this).attr("rel");
                                         if(rel){
                                                getData(pUserSerial,num,rel);
                                            }
                                   });
                  },
                error:function(){
                        alert("数据加载失败");
                 }
            });
        }
        //获取分页条
        function getPageBar(){
            //页码大于最大页数
            if(curPage>totalPage) curPage=totalPage;
             //页码小于1
             if(curPage<1) curPage=1;
                pageStr = "<span>共"+total+"条</span><span>"+curPage +"/"+totalPage+"</span>";
                 //如果是第一页
            if(curPage==1){
                pageStr += "<span>首页</span><span>上一页</span>";
            }else{
                pageStr += "<span><a href='javascript:void(0)' rel='1'>首页</a></span> <span><a href='javascript:void(0)' rel='"+(curPage-1)+"'>上一页</a></span>";
            }
            //如果是最后页
            if(curPage>=totalPage){
                pageStr += "<span>下一页</span><span>尾页</span>";
            }else{
                pageStr += "<span><a href='javascript:void(0)' rel='"+(parseInt(curPage)+1)+"'>  下一页</a></span><span><a href='javascript:void(0)' rel='"+totalPage+"'>尾页</a> </span>";
            }
        $("#pagecount").html(pageStr);
      }
</script>

更多相关内容可以关注