自定义分页插件

html省略，只上js

1

2

3

4

function page(currentNum, totalNum, perNum) {
    //得到分页总数
    var pageNum = Math.ceil(totalNum / perNum);
   
    var html = "";

    var text = "共" + totalNum + "条/"+"总"+pageNum+"页";

   // 只显示5个数字按钮        
    if (pageNum <= 5 && pageNum >= 1) {

   //如果是第一则显示图1
        if (currentNum == 1) {html += '<li style="width:125px">' + text + '</li><li page_no="1" style="width:45px">首页</li>';
        } else {

       //否则显示如下图2

    html += '<li style="width:125px">' + text + '</li><li page_no="' + (currentNum - 1) + '">&laquo;</li><li style="width:45px" page_no="1">首页</li>';
        }
        ;
        for (var i = 1; i <= pageNum; i++) {
            if (currentNum == i) {
                html += '<li class="page-item active" page_no="' + i + '">' + i + '</li>';
            } else {
                html += '<li class="page-item" page_no="' + i + '">' + i + '</li>';
            }

        }
        ;
        if (currentNum < pageNum) {
            html += '<li style="width:45px" class="page-item" page_no="' + pageNum + '">末页</li><li page_no="' + parseInt(++currentNum) + '">&raquo;</li>';
        } else {
            html += '<li style="width:45px" class="page-item" page_no="' + pageNum + '">末页</li><li page_no="' + pageNum + '">&raquo;</li>';
        }

// 大于5页的情况3
    } else {
        if (currentNum == 1) {
            html += '<li class="disabled" page_no="1" style="width:125px">' + text + '</li>';
        } else {
            html += '<li class="disabled" page_no="1" style="width:125px">' + text + '</li><li page_no="' + (currentNum - 1) + '">&laquo;</li><li style="width:45px" page_no="1">首页</li>';
        }
        ;

//  1 2 3 页        if (currentNum < 4) {
            for (var i = 1; i < pageNum && i <= 5; i++) {
                if (currentNum == i) {
                    html += '<li class="page-item active" page_no="' + i + '">' + i + '</li>';
                } else {
                    html += '<li class="page-item" page_no="' + i + '">' + i + '</li>';
                }

            }
        } else if (currentNum > pageNum - 2) {

// 页面为最后2个最大页数时 3

for (var i = pageNum - 4; i <= pageNum; i++) {
                if (currentNum == i) {
                    html += '<li class="page-item active" page_no="' + i + '">' + i + '</li>';
                } else {
                    html += '<li class="page-item" page_no="' + i + '">' + i + '</li>';
                }

            }
        } else {

//其他情况使当前页数按钮居中（第三位）4

for (var i = currentNum - 2; i <= pageNum && i <= Number(currentNum) + 2; i++) {
                if (currentNum == i) {
                    html += '<li class="page-item active" page_no="' + i + '">' + i + '</li>';
                } else {
                    html += '<li class="page-item" page_no="' + i + '">' + i + '</li>';
                }
            }
        }
        ;
        if (currentNum < pageNum) {
            html += '<li style="width:45px" page_no="' + pageNum + '">末页</li><li page_no="' + parseInt(++currentNum) + '">&raquo;</li>';
        } else {
            html += '<li style="width:45px" page_no="' + pageNum + '">末页</li><li page_no="' + pageNum + '">&raquo;</li>';
        }
    }

    $(".pagination").html(html);
}