springmvc pagination 實現數據分頁

pagination 插件下載：https://download.csdn.net/download/weixin_40652498/12313663

    <link rel="stylesheet" href="lib/pagination.css" />
    <script type="text/javascript" src="lib/jquery.min.js"></script>
    <script type="text/javascript" src="lib/jquery.pagination.js"></script>


    <div id="Searchresult">分頁內容（自動替換)</div>

    <div style="margin-left: 330px"><div id="Pagination" class="pagination"  ><!-- 這裏顯示分頁 --></div></div>



$(function(){
        //這是一個非常簡單的demo實例，讓列表元素分頁顯示
        //回調函數的作用是顯示對應分頁的列表項內容
        //回調函數在用戶每次點擊分頁鏈接的時候執行
        //參數page_index{int整型}表示當前的索引頁
        var initPagination = function() {  //頁碼加載
            var num_entries = 1;   //有多少個分頁

            $.ajax({
                url: "selectPageNum",
                async:false,   //同步請求
                success: function (size) {
                    num_entries=size;
                }
            });

            // 創建分頁
            $("#Pagination").pagination(num_entries, {
                num_edge_entries: 1, //邊緣頁數
                num_display_entries: 4, //主體頁數
                callback: pageselectCallback,
                items_per_page:1 //每頁顯示1項
            });
        }();

        function pageselectCallback(page_index, jq){   //切換頁數
            var new_content=" <table id='table' class='table table-bordered' style='width: 800px'>"+
            "<tr> <td><font color='red'>eid</font></font></td><td><font color='red'>ename</font></td><td><font color='red'>did</font></td><td><font color='red'>dname</font></td><td><font color='red'>daddress</font></td><td><button onclick='addData()'><font color='#4c84ff'>添加</font></button></td>   </tr>";
            $.ajax({
                url: "select",
                async:false,   //同步請求
                data: {start: page_index, leng: 10},
                success: function (data) {
                    var list = eval("("+data+")");   //返回List 數據
                    for(var i=0;i<list.length;i++){
                        new_content+=" <tr>";

                        new_content +="<td>"+ list[i].eid+"</td>";
                        new_content +="<td>"+ list[i].ename+"</td>";
                        new_content +="<td>"+ list[i].dno.did+"</td>";
                        new_content +="<td>"+ list[i].dno.dname+"</td>";
                        new_content +="<td>"+ list[i].dno.daddress+"</td>";
                        new_content +="<td>"+ "<button onclick='updateData(\""+list[i].eid+"\")'><font color='#4c84ff'>修改</font></button>  <button onclick='deleteData(\""+list[i].eid+"\")'><font color='#4c84ff'>刪除</font></button>";+"</td>";
                        new_content+=" </tr>";

                    }
                    new_content+=" </table>";
                }
            });

            $("#Searchresult").empty().append(new_content); //裝載對應分頁的內容
            return false;
        }



    });