北在北方

太白枝头看,花开不计年,杯中浮日月,楼外是青天。

导航

JavaScript显示分页按钮

Posted on 2014-06-24 22:46  CN.programmer.Luxh  阅读(881)  评论(0编辑  收藏  举报
/**
 * 获取分页按钮
 * @param total_page     总页数
 * @param current_page  当前页
 * @param num                    每页显示多少个分页按钮
 * @returns {String}
 */
function get_page_html(total_page,current_page,num){
    
    var page_html = "";
    if(isNaN(total_page) && isNaN(current_page)){
        
    }else{
        //范围判断
        if(current_page>total_page) {
            current_page = total_page;
        }
        
        // 当前页的前后各显示多少页
        var count = Math.floor(num/2);
        
        // 当前页后面要显示的页数
        var after_count = count;
        if(count-current_page>0){
            after_count += (count-current_page);
        }
        if(total_page<=1) {
            //只有一页
            page_html += '<ul class="pagination">';
            page_html += '<li class="active"><a href="javascript:pageQuery(1)">1</a></li>';
            page_html += '</ul>';
        }else if(total_page<=num){
            page_html += '<ul class="pagination">';
             //把页数全部显示出来
            for(var i=1;i<=total_page;i++) {
                if(current_page==i){
                       page_html += '<li class="active"><a href="javascript:pageQuery('+current_page+')">'+current_page+'</a></li>';
                }else{
                       page_html += '<li><a href="javascript:pageQuery('+i+')">'+i+'</a></li>';
                }
            }
            page_html += '</ul>';
        }else {
            page_html += '<ul class="pagination">';
            
            //显示前一页按钮
            if(current_page-count>1) {
                page_html += '<li><a href="javascript:pageQuery('+(current_page-1)+')">&laquo;</a></li>';
            }
            //显示当前页前面的页码按钮
            for(var i=count;i>=1;i--) {
                if(current_page-i>0){
                    page_html += '<li><a href="javascript:pageQuery('+(current_page-i)+')">'+(current_page-i)+'</a></li>';
                }
            }
            
            // 当前页按钮
            page_html += '<li class="active"><a href="javascript:pageQuery('+current_page+')">'+current_page+'</a></li>';
        
            // 显示当前页后面的页码按钮
            for(var j=1;j<=after_count;j++){
                if((current_page+j)<=total_page){
                    page_html += '<li><a href="javascript:pageQuery('+(current_page+j)+')">'+(current_page+j)+'</a></li>';
                }
            }
            
            //显示后一页按钮
            if(current_page+count<total_page){
                page_html += '<li><a href="javascript:pageQuery('+(current_page+1)+')">&raquo;</a></li>';
            }
            page_html += '</ul>';
        }
    }
    return page_html;
}

效果