ThinkPHP实现ajax无刷新分页

转载自：http://www.cnblogs.com/kingfly/p/4065708.html

新建AjaxPage.class.php

TP3.1版本放入ThinkPHP/Extend/Library/ORG/Util目录下，写入一下内容：

<?php
// +----------------------------------------------------------------------
// | ThinkPHP [ WE CAN DO IT JUST THINK IT ]
// +----------------------------------------------------------------------
// | Copyright (c) 2006-2014 http://thinkphp.cn All rights reserved.
// +----------------------------------------------------------------------
// | Licensed ( http://www.apache.org/licenses/LICENSE-2.0 )
// +----------------------------------------------------------------------
// | Author: Jason <jason123@vip.qq.com> <http://www.huangji.me>
// +----------------------------------------------------------------------

class AjaxPage{
    public $firstRow; // 起始行数
    public $listRows; // 列表每页显示行数
    public $parameter; // 分页跳转时要带的参数
    public $totalRows; // 总行数
    public $totalPages; // 分页总页面数
    public $rollPage   = 11;// 分页栏每页显示的页数
    public $lastSuffix = true; // 最后一页是否显示总页数

    private $p       = 'p'; //分页参数名
    private $url     = ''; //当前链接URL
    private $nowPage = 1;
    private $ajax_func = '';    //ajax函数名

    // 分页显示定制
    private $config  = array(
        'header' => '<span class="rows">共 %TOTAL_ROW% 条记录</span>',
        'prev'   => '<<',
        'next'   => '>>',
        'first'  => '1...',
        'last'   => '...%TOTAL_PAGE%',
        'theme'  => '%FIRST% %UP_PAGE% %LINK_PAGE% %DOWN_PAGE% %END%',
    );

    /**
     * 架构函数
     * @param array $totalRows  总的记录数
     * @param array $listRows  每页显示记录数
     * @param array $parameter  分页跳转的参数
     */
    public function __construct($totalRows, $listRows=20, $ajax_func, $parameter = array()) {
        C('VAR_PAGE') && $this->p = C('VAR_PAGE'); //设置分页参数名称
        /* 基础设置 */
        $this->totalRows  = $totalRows; //设置总记录数
        $this->ajax_func = $ajax_func; //ajax函数名
        $this->listRows   = $listRows;  //设置每页显示行数
        $this->parameter  = empty($parameter) ? $_GET : $parameter;
        $this->nowPage    = empty($_GET[$this->p]) ? 1 : intval($_GET[$this->p]);
        $this->nowPage    = $this->nowPage>0 ? $this->nowPage : 1;
        $this->firstRow   = $this->listRows * ($this->nowPage - 1);
    }

    /**
     * 定制分页链接设置
     * @param string $name  设置名称
     * @param string $value 设置值
     */
    public function setConfig($name,$value) {
        if(isset($this->config[$name])) {
            $this->config[$name] = $value;
        }
    }

    /**
     * 生成链接URL
     * @param  integer $page 页码
     * @return string
     */
    private function url($page){
        return str_replace(urlencode('[PAGE]'), $page, $this->url);
    }

    /**
     * 组装分页链接
     * @return string
     */
    public function show() {
        if(0 == $this->totalRows) return '';

        /* 生成URL */
        $this->parameter[$this->p] = '[PAGE]';
        $this->url = U(ACTION_NAME, $this->parameter);
        /* 计算分页信息 */
        $this->totalPages = ceil($this->totalRows / $this->listRows); //总页数
        if(!empty($this->totalPages) && $this->nowPage > $this->totalPages) {
            $this->nowPage = $this->totalPages;
        }

        /* 计算分页零时变量 */
        $now_cool_page      = $this->rollPage/2;
        $now_cool_page_ceil = ceil($now_cool_page);
        $this->lastSuffix && $this->config['last'] = $this->totalPages;

        //上一页
        $up_row  = $this->nowPage - 1;
        $up_page = $up_row > 0 ? '<a class="prev" href="javascript:'.$this->ajax_func.'('.$upRow.')">' . $this->config['prev'] . '</a>' : '';

        //下一页
        $down_row  = $this->nowPage + 1;
        $down_page = ($down_row <= $this->totalPages) ? '<a class="next" href="javascript:'.$this->ajax_func.'('.$down_row.')">' . $this->config['next'] . '</a>' : '';

        //第一页
        $the_first = '';
        if($this->totalPages > $this->rollPage && ($this->nowPage - $now_cool_page) >= 1){
            $the_first = '<a class="first" href="javascript:'.$this->ajax_func.'(1)" >' . $this->config['first'] . '</a>';
        }

        //最后一页
        $the_end = '';
        if($this->totalPages > $this->rollPage && ($this->nowPage + $now_cool_page) < $this->totalPages){
            $the_end = '<a class="end" href="javascript:'.$this->ajax_func.'('.$this->totalPages.')" >' . $this->config['last'] . '</a>';
        }

        //数字连接
        $link_page = "";
        for($i = 1; $i <= $this->rollPage; $i++){
            if(($this->nowPage - $now_cool_page) <= 0 ){
                $page = $i;
            }elseif(($this->nowPage + $now_cool_page - 1) >= $this->totalPages){
                $page = $this->totalPages - $this->rollPage + $i;
            }else{
                $page = $this->nowPage - $now_cool_page_ceil + $i;
            }
            if($page > 0 && $page != $this->nowPage){

                if($page <= $this->totalPages){
                    $link_page .= '<a class="num" href="javascript:'.$this->ajax_func.'('.$page.')" >' . $page . '</a>';
                }else{
                    break;
                }
            }else{
                if($page > 0 && $this->totalPages != 1){
                    $link_page .= '<span class="current">' . $page . '</span>';
                }
            }
        }

        //替换分页内容
        $page_str = str_replace(
            array('%HEADER%', '%NOW_PAGE%', '%UP_PAGE%', '%DOWN_PAGE%', '%FIRST%', '%LINK_PAGE%', '%END%', '%TOTAL_ROW%', '%TOTAL_PAGE%'),
            array($this->config['header'], $this->nowPage, $up_page, $down_page, $the_first, $link_page, $the_end, $this->totalRows, $this->totalPages),
            $this->config['theme']);
        return "<div>{$page_str}</div>";
    }
}

控制器里写入如下内容

class IndexAction extends BaseAction {
    public function index($p=1,$order='1'){
        $archivesModel = D('Archives');
        $count = $archivesModel->count(); //计算记录数
        $pagelist = 5; // 设置每页记录数
        $pageHTML = $this->getAjaxPage($count,$pagelist,'archives');//第三个参数是你需要调用换页的ajax函数名
        $rows = $archivesModel->getList($p,$order);
        $this->assign('rows',$rows);
        $this->assign('page',$pageHTML);
        $this->display();
    }
}

模板文件如下：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <script src="http://libs.baidu.com/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
    <style type="text/css">
        /**
         *---------------分页样式-----------------
         */
        .pages {
            font-size: 0;
            margin: 5px auto;
            padding-bottom: 25px;
            padding-top: 0;
            text-align: center;
        }
        .pages a {
            display: inline-block;
            margin-right: 3px;
        }
        .pages a, .pages a:visited, .pages a:link, .pages a:hover {
            color: #000000;
            text-decoration: none;
        }
        .pages a {
            border: 1px solid #DDDDDD;
            display: inline-block;
            font-size: 14px;
            line-height: 28px;
            padding: 0 10px;
        }
        .pages span {
            background: none repeat scroll 0 0 #2D96E9;
            border: 1px solid #DDDDDD;
            color: #FFFFFF;
            display: inline-block;
            font-size: 14px;
            font-weight: 700;
            line-height: 28px;
            padding: 0 10px;
            margin-right: 3px;
        }
        .pages span.rows{
            background: none;
            color: #000;
            font-weight: normal;
        }
        .pages .current, .pages a:hover{background:none repeat scroll 0 0 #2D96E9; border:1px solid #2D96E9; color:#FFFFFF}
        /**
         *------------------分页样式---------------------
         */            
    </style>

</head>
<body>
<script type="text/javascript">
    function archives(id){    //archives函数名 一定要和action中的第三个参数一致上面有
        var id = id;
        $.get('/App/index.php/Index/index', {'p':id}, function(data){  //用get方法发送信息到IndexAction中的index方法
            $("#archives").replaceWith("<div  id='archives'>"+data+"</div>"); //archives一定要和tpl中的一致
        });
    }

</script>
<div id='archives'>
    <ul>
    <volist name="rows" id="row">
        <li>{$row.id} | {$row.title}</li>
    </volist>
    </ul>
    <div id="page" class="pages">
        {$page}
    </div>
</div>
</body>
</html>

如果你的分页链接中有其他的参数，可以在上面的$.get中，添加你的参数：，例如：{‘p’:id,’order’:’desc’}等

相关文章：《ThinkPHP+jquery.tmpl实现ajax无刷新分页》