导入

<!-- 分页模块 -->
<link href="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="pagination/css/htmleaf-demo1.css">

<script src="http://cdn.bootcss.com/jquery/1.11.0/jquery.min.js" type="text/javascript"></script>
<script>window.jQuery || document.write('<script src="pagination/js/jquery-1.11.0.min.js"><\/script>')</script>
<script type="text/javascript" src="pagination/js/jqPaginator.js"></script>

html

<div class="container">
    <div class="row" style="min-height:500px;padding:2em 0;">
        <p id="p1"></p>
        <ul class="pagination" id="pagination1"></ul>
        <!-- <p id="p2"></p>-->
        <!-- <ul class="pagination" id="pagination2"></ul>-->
    </div>
</div>

加载函数

<script type="text/javascript">
    var num;        // 当前页码
    var totalPages; // 总页码
    var u_num;      // 用户数目

    // 当前页码数据 不用动这里 后面调用
    function usersInfo(pageIndex) {
    
    
        $.ajax({
    
    
            url: '/bookAllInfo',
            type: 'GET',
            dataType: 'json',
            data: {
    
    
                'accessType': '0',
                'pageIndex': pageIndex
            },
            success: function (res) {
    
    
                console.log(res)
                var str = '';
                for (i = 0; i < res.results.length; i++) {
    
    
                    // console.log(res.results[i].username);
                    str += "<tr><td>" + res.results[i].isbn + "</td>" +
                        "<td>" + res.results[i].title + "</td>" +
                        "<td>" + res.results[i].booktype + "</td>" +
                        "<td>" + res.results[i].position + "</td>" +
                        "<td>" + res.results[i].kucun + "</td>" +
                        "<td>" + res.results[i].weihuan + "</td>" +
                        "<td>" + res.results[i].publisher + "</td>" +
                        "<td><a class='tablelink' href='/changeBookInfo?key=" + res.results[i].isbn + "'>修改</a></td></tr>"
                    $("#content").html(str);
                }

            },
            error: function () {
    
    

            }
        });
    }


    console.log(totalPages);
    // 获取总页码
    $.ajax({
    
    
        url: '/books_num',
        type: 'GET',
        dataType: 'json',
        success: function (res) {
    
    
            books_num = res.books_num;
            // 计算总页数
            tp = books_num / 10;
            // console.log(tp);
            // if ((tp % 10) != 0) {
    
    
            //     console.log(tp - 1)
            //     tp += 1;
            // }
            // console.log("books_num:" + books_num);
            tp = Math.ceil(tp);


            $.jqPaginator('#pagination1', {
    
    
                totalPages: 100,
                visiblePages: 5,
                currentPage: 1,
                onPageChange: function (num, type) {
    
    
                    // $('#p1').text(type + '：' + num);
                    usersInfo(num)
                }
            });

        },
        error: function () {
    
    

        }
    });
    
</script>

下载地址：https://920.lanzous.com/iQBxam0o2yh
密码:etdc