thinkphp ajax分頁

thinkphp中用ajax分頁和普通的ajax分頁的區別在於處理位置的不一樣，thinkphp是在控制器的方法中處理ajax傳的值，而後返回數據。下面是一個點擊事件觸發後，顯示的內容用ajax分頁。

下面的示例是同一個類別下，根據點擊不一樣的分類顯示出點擊的分類的數據。

須要修改的地方用黃色背景標示。

1.ajax處理頁面

$(".php_list").click(function(){//點擊事件，能夠根據本身的要求修改。也能夠放在$(document).ready(function(e) {})裏面自動加載。
        var leibie = "php";//獲取的須要處理的參數。
        var fenlei = $(this).html();//獲取的須要處理的參數。
        
        $("#fy_n").val("1");//傳頁數，默認是第1頁。
        $(document).ready(function(e) {
            JiaZai();//調用加載方法。
            var zys = 0;
            })
　　　　　　　　//頁面加載數據
            function JiaZai()
            {        
                var n = $("#fy_n").val();//頁數顯示框裏面顯示的頁數
                $.ajax({
                url:"__CONTROLLER__/pagechuli3",//第一個處理頁面
                data:{fenlei:fenlei,n:n,leibie:leibie},//要傳的參數，n是必需要寫的，其它參數根據本身的需求寫。
                type:"POST",
                dataType:"JSON",
                success: function(data){
                        var str ="";
                        for(var i in data)//for循環裏面是要顯示的一條內容，要拼接字符串。
                        {    
                             str =str+ "<div class='panel panel-default index_list_wai'><div class='panel-body'><div class='index_list_left'><div><img src='__PUBLIC__/img/img.jpg' width='40' height='50' /></div><div class='index_list_user_nick'>"+data[i].keyword+"</div></div><div class='index_list_right'><a href='#'><div class='index_list_ziyuan_title'>"+data[i].title+"</div></a><div class='index_list_ziyuan_jianjie'>"+data[i].jianjie+"</div> <div class='index_list_ziyuan_di'><span class='index_list_ziyuan_wenben'>做者："+data[i].faburen+"</span><span class='index_list_ziyuan_wenben'>分數："+data[i].avg+"</span><span class='index_list_ziyuan_wenben'>點擊量："+data[i].djnumber+"</span><span class='index_list_ziyuan_wenben'>上傳時間："+data[i].time+"</span></div></div></div></div>";
                        }
                        $("#php_list").html(str);//把拼接好的字符串放到指定的地方
                    }
            });
                            
            //獲取分頁數(列表)
            $.ajax({
                url:"__CONTROLLER__/pagechuli4",//第2個處理頁面
                data:{fenlei:fenlei,leibie:leibie},//傳的參數。這裏是要查詢fenlei（分類）和leibie（類別）的數據的數量，把這兩個值傳過去。
                type:"POST",
                dataType:"TEXT",
                success: function(data){ 
                    //總頁數
                    //alert(data);
                    var ys = Math.ceil(data/5); //這裏的5是每頁要顯示的條數，注意和處理頁面的顯示的數據量一致。
　　　　　　　　　　　　//從這裏開始，下面的代碼是顯示頁數的，通常不須要更改，若是須要改變顯示的頁數的樣式，能夠修改。
                    zys = ys;                  
                    var s = "<li><a id='fy_shang'>&laquo;</a></li>";
                    var dangqian = $("#fy_n").val(); //當前頁數                       
                    for(var i=dangqian-2;i<=dangqian+2;i++)
                    {
                        if(i>0 && i<=ys)
                        {
                            if(dangqian==i)
                            {
                                s+="<li class='active'><a class='fy_zhong'>"+i+"</a></li>";
                            }
                            else
                            {
                                s+="<li><a class='fy_zhong'>"+i+"</a></li>"
                            }
                        }
                    }
                    s += "<li><a id='fy_xia'>&raquo;</a></li>";
                    $("#fy_list").html(s);
                            
                    //給分頁列表加事件
                    JiaShiJian();
                }
            })
        　　//給分頁列表加事件的方法
        　　function JiaShiJian()
        　　{
        　　　　$("#fy_shang").click(function(){    
        　　　　var n = $("#fy_n").val(); 
        　　　　if(n>1)
        　　　　{
        　　　　　　n--;
        　　　　}
        　　　　else
        　　　　{
        　　　　　　n=1;
        　　　　}
        　　　　　　$("#fy_n").val(n);
        
        　　　　//加載數據
        　　　　JiaZai();
        　　　　})
        　　　　$("#fy_xia").click(function(){
        　　　　var n = $("#fy_n").val(); 
        　　　　if(n<zys)
        　　　　{
        　　　　　　n++;
        　　　　}
        　　　　else
        　　　　{
        　　　　　　n=zys;
        　　　　}
        　　　　$("#fy_n").val(n);
        
        　　　　//加載數據
        　　　　JiaZai();
        　　　　})
        　　　　　　$(".fy_zhong").click(function(){
        　　　　　　var n = $(this).text();
        　　　　　　$("#fy_n").val(n);
        
        　　　　//加載數據
        　　　　JiaZai();
         
        　　　　})
        　　}        
        
        }
    })
</script>

2.thinkphp處理方法，裏面是2個方法。

　　//點擊類別後要顯示的內容
    public function pagechuli3()//這個方法的功能是根據ajax傳過來的值查詢數據，再將查詢出來的數據返回到ajax，返回的默認是JSON類型。
    {
        $u = D("zy_list");//造對象，表格名爲zy_list。
        $n = $_POST[n];//取到傳過來的默認的頁數的值。
        $class = $_POST["leibie"];//取傳過來的類別的值。
        $fenlei = $_POST["fenlei"];//取傳過來的分類的值。
        if($fenlei=="所有資源")//若是分類是所有資源
        {
            $lie = $u->where("class='$class'")->page($n,'5')->select();//查詢類別爲目標類別的全部數據，調用thinkphp中的page方法，每頁顯示5條，和ajax裏面的5要一致。
            $this->ajaxReturn($lie);//將查詢到的數據返回到ajax，注意默認返回的是JSON類型。
        }
        else//下面的只是在查詢數據的時候又多加了一個條件。
        {
            $lie = $u->where("class='$class' and fenlei='$fenlei'")->page($n,'5')->select(); $this->ajaxReturn($lie);
        }
    }
    
    //點擊類別後要顯示的頁數
    public function pagechuli4()
    {
        $u = D("zy_list");//造對象
        $class = $_POST["leibie"];//獲取數據
        $fenlei = $_POST["fenlei"];//獲取數據
        if($fenlei=="所有資源")
        {
            $sl = $u->where("class='$class'")->count();//查詢類別是目標類別的全部數據的數量
            $this->ajaxReturn($sl,"eval");//數據的數量是數字，返回的數據類型不能再是JSON了，在裏面加上eval表示將返回的數據類型更改成TEXT，注意ajax頁面接收的也必須是TEXT。
        }
        else//下面的查詢數據的數量也只是多增長了一個條件
        {
            $sl = $u->where("class='$class' and fenlei='$fenlei'")->count(); $this->ajaxReturn($sl,"eval");
        }
    }