javascript 版分页类, 可用于ajax

/*
 javascript 版分页类, 可用于ajax
 2010-10-21 20:52 by ggg

*/
var ggg_pager= {

    m_total : 0 ,            //总记录数
    m_onepage : 0 ,        //每页显示几条记录
    m_num : 5 ,            //显示几个页码
    m_currPage : 0 ,        //当前是第几页
    m_totalPage : 0 ,    //总共有几页
    m_offset : 0 ,        //当前是第几条记录

    

    //m_currPageStyle     : "currPage",    //分页导行显示在哪个元素里
    m_currPageStyle     : "page_h",    //分页导行显示在哪个元素里
    
    //m_currPageStyle     : "currPage",    //当前页面样式名
    m_otherPageStyle     : "otherPage",    //当前页面样式名

    m_SymbolNextPage     : "下一页",    //下一页图标
    m_SymbolPrevPage     : "上一页",    //上一页图标
    m_SymbolNextGroup     : "[>>]",    //下一组图标
    m_SymbolPrevGroup     : "[<<]",    //上一组图标

    m_goCallFunction     : null,    //点页码时回调

    /**
     * 初始化参数
     *
     * @param int $total        总记录数
     * @param int $onepage        每页显示几条记录
     * @param int num        显示几个页码
     * @param function callFunc        点页码时回调
     * @return null
     */
    iniParams : function( total, onepage, callFunc,num,pageNavDom){

        this.m_total    = total;
        this.m_onepage    = onepage;

        

        if(typeof(num)  != 'undefined')
            this.m_num    = num;

        if(typeof(callFunc)  != 'undefined')
            this.m_goCallFunction    = callFunc;


        this.m_totalPage =  Math.ceil(total / onepage);

    },


    /**
     * 取得下一页.$char为链接的字符,默认为"[>]"
     *
     * @return string
     */
    nextPage : function( ) {

        var total_page = this.m_totalPage;
        var pagecount = this.m_currPage;
        //var char = this.m_SymbolNextPage;
        var char = '<strong class="pa_d">' +  this.m_SymbolNextPage  + '</strong>';
    
        var next_page    = 0;
        if (pagecount < total_page)
        {
            next_page = pagecount + 1;
            return this.pageButton2(next_page,char,"下一页");
        }
        else
        {
            return '<strong class="page_down">上一页</strong>';
        }
    },

    /**
     * 取得上一页.$char为链接的字符,默认为"[<]"
     *
     * @return string
     */
    prePage : function( ) {

        var pagecount = this.m_currPage;
        //var char = this.m_SymbolPrevPage;
        var char = '<strong class="pa_u">' +  this.m_SymbolPrevPage  + '</strong>';
    
        var pre_page    = 0;
        if (pagecount>1)
        {
            pre_page = pagecount - 1;
            return this.pageButton2(pre_page,char,"上一页");
        }
        else
        {
            return '<strong class="page_up">上一页</strong>';
        }
    },



    /**
     * 取得上一组数字条.$char为链接的字符,默认为"[<<]"
     *
     * @return string
     */
    preGroup : function( ) {

        var pagecount   = this.m_currPage;
        var num         =  this.m_num;
        var mid         =  Math.floor(num/2);
        var minpage     =  (pagecount - mid)<1 ? 1 : pagecount - mid;
        char        = this.m_SymbolPrevGroup ;
        var pgpagecount =  minpage > num ? minpage - mid : 1;

        return this.pageButton(pgpagecount,char,"上一组页码段");

    },

    /**
     * 取得下一组数字条.$char为链接的字符,默认为"[>>]"
     *
     * @return string
     */
    nextGroup : function( ) {

        var pagecount   = this.m_currPage;
        var totalpage = this.m_totalPage;
        var num         =  this.m_num;
        var mid         =  Math.floor(num/2);
        var last      =  num;
        var minpage     =  (pagecount - mid)<1 ? 1 : pagecount - mid;
        var maxpage   =  minpage + last;

        if (maxpage > totalpage)
        {
            maxpage = totalpage;
            minpage = maxpage - last;
            minpage = minpage < 1 ? 1 : minpage;
        }

        char    =  this.m_SymbolNextGroup ;
        var ngpagecount = (totalpage > maxpage + last)? maxpage + mid : totalpage;


        return this.pageButton(ngpagecount,char,"下一组页码段");


    },


    /**
     * 取得第一页.$link为1是为带链接
     *
     * @param int $num 为个数,默认为10
     * @param string $color 为当前链接的突显颜色
     * @return string
     */
    firstPage : function( link ) {

        //var linkchar  = "<span class='"+this.m_otherPageStyle+"'> 1</span>";
        var linkchar  = "首页";
        if (link==1)
        {
            return this.pageButton(1,linkchar,"第一页");
        }
        else
        {
            return 1;
        }

    },

    lastPage : function( link ) {
        var totalpage = this.m_totalPage;
        //var linkchar  = "<span class='"+this.m_otherPageStyle+"'> 1</span>";
        var linkchar  = "尾页";
        if (link!=totalpage)
        {
            return this.pageButton(totalpage,linkchar,"最后一页");
        }
        else
        {
            return totalpage;
        }

    },


    /**
     * 取得页码数字条
     *
     * @param string $color 为当前链接的突显颜色
     * @param string $left 数字左边 默认为"["
     * @param string $right 数字左右 默认为"]"
     * @return string
     */
    numBar : function(   left, right) {

        var num      =  this.m_num ;

        var mid       =  Math.floor(num/2);

        var last      =  num - 1;

        var pagecount = this.m_currPage;

        var totalpage = this.m_totalPage;
    
        //left      =  typeof(left) =='undefined' ? "[" : left;
        //right     =  typeof(right) =='undefined' ? "]" : right;
        left      =  typeof(left) =='undefined' ? "" : left;
        right     =  typeof(right) =='undefined' ? "" : right;

        var minpage   =  (pagecount - mid)<1 ? 1 : pagecount - mid;
        var maxpage   =  minpage + last;

        if (maxpage > totalpage)
        {
            maxpage =  totalpage;
            minpage =  maxpage - last;
            minpage =  minpage<1 ? 1 : minpage;
        }


        var linkchar = Array();
        var class_style = null;
        var chars = null;

        for (var i = minpage; i<= maxpage; i++)
        {

            chars = left + i+ right;
            //当前页
            if (i == pagecount)
            {
                class_style = this.m_currPageStyle;
            }
            else
                class_style = this.m_otherPageStyle;


            linkchar.push(this.pageButton(i,chars,"第"+i+"页",class_style));
        }
        return linkchar.join('');

    },

    //得到页码内容
    pageButton : function(num,char,title,classStyle){
        
        classStyle      =  typeof(classStyle) =='undefined' ? this.m_otherPageStyle : classStyle;
        return "<a  class='"+classStyle+"' href='javascript:void(0);'  onclick='ggg_pager.go("+num+")' title=\""+title+"\">"+char+"</a>";
    },

        //得到页码内容方式2，为控制a标签样式增加
    pageButton2 : function(num,char,title,classStyle){
        
        classStyle      =  typeof(classStyle) =='undefined' ? this.m_otherPageStyle : classStyle;
        return "<a  class='"+classStyle+"' style='padding:0;margin:0' href='javascript:void(0);'  onclick='ggg_pager.go("+num+")' title=\""+title+"\">"+char+"</a>";
    },


    //跳到指定页面
    //返回
    go : function(num){
        /**/
        this.m_currPage    = num;

        //返回下页代码
        var ret_str    = this.getPages(num);

        //回调指定函数
        if(null != this.m_goCallFunction)
            this.m_goCallFunction(num,ret_str);

        return ret_str;

    },


    //得到最终的分页效果
    //currPage 当前第几页
    getPages : function(currPage){

        if (currPage=='')
        {
            this.m_currPage = 1;
            this.m_offset    = 0;
        }
        else
        {
            this.m_currPage = currPage;
            this.m_offset    =  (currPage - 1) * this.m_onepage;
        }


        var num_bar = this.numBar();

        var first_page = this.firstPage(1, '');
        var last_page = this.lastPage(this.m_totalPag, '');

        var pre_group = this.preGroup(this.m_SymbolPrevGroup);
        var next_group = this.nextGroup(this.m_SymbolNextGroup);


        var next_page = this.nextPage(this.m_SymbolNextPage);
        var pre_page = this.prePage(this.m_SymbolPrevPage);


        //var ret_str    =  first_page + pre_group +pre_page + num_bar +next_page +next_group;
        var ret_str    = first_page + pre_page + num_bar +next_page +last_page;
        return ret_str;
    }

};

调用示例：

//调用分页类实现分页 begin
                //点击某页时的回调函数
                function page_click(numb,pageString)
                {  
                    //这里可以用 ajax 进行取页面里的内容
                    //numb为页数,pageString为分页导航内容
                    var bstr = "";
                    var kstr = "";
                    url = "/tool/xiaoshuo.php";
                    if (booktype!=null&&booktype!="") bstr = booktype;
                    if (keyword!=null&&keyword!="") kstr = keyword;
                    $.get(url,{booktype:bstr,keyword:kstr,pnum:numb},result,"json");
                    pnum = numb;
                    //重新显示页面
                    $("#page_nav").html(pageString);
                }
                /*
                 * 初始化参数
                 *
                 * @param int $total        总记录数
                 * @param int $onepage        每页显示几条记录
                 * @param int num        显示几个页码
                 * @param function callFunc        点页码时回调
                 * @return object
                 */
                //iniParams : function( total, onepage, callFunc,num,pageNavDom){
                ggg_pager.iniParams(obj['totalnum'],16,page_click,10);
                
                //默认当前第几页
                var curr_page    = pnum;
                $("#page_nav").html(ggg_pager.getPages(curr_page));
                //调用分页类实现分页 end