由於國內關於myPagination外掛的文件並不多，由於參照官方給的文件一直出現問題， 所以自己摸索出了一種新的食用方法。

定義全域性變數和預設搜尋條件

        var searchJson = {};
        //預設的搜尋條件
        searchJson.voucherDate = " , ";
        searchJson.sortTag = "sortTime";
        searchJson.pageNumber = 1;
        searchJson.pageSize = 10;

        var pagin = new myPagination({
            id: 'pagination',
            curPage:1, //初始頁碼
            pageTotal: 5,　　   //總頁數
            pageAmount: 10,     //每頁多少條
            dataTotal: 50,      //總共多少條資料
            showPageTotalFlag:true, //是否顯示資料統計
            showSkipInputFlag:true, //是否支援跳轉
            getPage: function (page) {//獲取當前頁數
                searchJson.pageNumber = page;
                getTotalList(JSON.stringify(searchJson));
            }
        });
 

ajax請求資料並渲染

        //ajax獲取要顯示的資料
        function getTotalList(json){
            $.ajax({
                type: "POST",
                contentType: 'application/json;charset=utf-8',
                url: "url",
                data: json,
                success: function(data){
                    //關閉彈出框
                    $("#searchDiv").find("div.dropdown-menu").hide();
                    var msg = JSON.parse(data);
                    if (msg.message == "查詢成功") {//將查詢到的資料渲染到頁面
                        var totalData = msg.code;
                        var suns = msg.data;
                        var $div = $("#voucherList").empty();
                        $.each(suns,function(index,item){...});//省略渲染資料的程式碼
                        pagin.pageTotal = Math.ceil(totalData/10);
                        pagin.dataTotal = totalData;
                        pagin.init();
                    }
            });
        }

 

最重要的是最後一行程式碼：

pagin.init();

初始化，即讓上面兩行修改的總頁數和總條數引數生效

搜尋按鈕點選事件

            //彈出搜尋框
            $(".dropdown-menu").click(function (e) {
                var type = $(e.target).attr("id");
                if(type === "inputZhaiYao"){
                    $("#InfoKemu").hide();
                    e.stopPropagation();
                }
                else if(type === "inputKemu"){
                    $("#InfoZhaiYao").hide();
                    e.stopPropagation();
                }
                else if(type === "searchBtn"){//搜尋按鈕
                    var time1 = $("#sele-month1").val();
                    var time2 = $("#sele-month2").val();
                    var sortTag = $("#frm").find("input[name='sort']:checked").val();
                    var pageNumber = $()
                    searchJson.voucherDate = time1+" , "+time2;
                    searchJson.sortTag = sortTag;
                    searchJson.pageNumber = 1;
                    searchJson.pageSize = 10;
                    $("#searchDiv").removeClass("open");
                    $("#searchDiv").find("div.dropdown-menu").hide();
                    $("#InfoZhaiYao").hide();
                    $("#InfoKemu").hide();
                    //渲染資料
                    getTotalList(JSON.stringify(jsonData));
                    e.stopPropagation();
                }
                else{
                    $("#InfoZhaiYao").hide();
                    $("#InfoKemu").hide();
                    e.stopPropagation();
                }

            });