在项目中如何利用分页插件呢？

首先封装了分页代码作为一个插件，代码如下：

(function ($) {

 

            jQuery.pageflip = {

 

                paging: function (newPageIndex, recordCount) {

 

                    var obj = $.extend({}, $.pageflip.defaultVal, $.pageflip.defaults);

                    pageIndex = newPageIndex;

                    var _page = $(obj.PagePosition),

                                show_indexStart,

                                show_End,

                                omit = [],

                                txtPage = $("<input type='text' style='30px; margin-left:10px; margin-right:10px;'/>"),

                                btnPage = $('<input type="button" value="Go"/>'),

                                pageCount = Math.floor(recordCount / obj.pageSize) + (recordCount % obj.pageSize == 0 ? 0 : 1);

 

                    if (pageCount > 0) {

                        _page.show();

                    } else {

                        _page.hide();

                    }

 

                    _page.empty();

 

                    var _a = (function () {

                        var links = {};

                        $.each($.pageflip.defaultVal.pageLocalized, function (key, value) {

                            var _pageIndex = pageIndex;

                            switch (key) {

                                case 'first':

                                    _pageIndex = 0;

                                    break;

                                case 'prev':

                                    _pageIndex = _pageIndex - 1;

                                    break;

                                case 'next':

                                    _pageIndex = _pageIndex + 1;

                                    break;

                                case 'last':

                                    _pageIndex = pageCount;

                                    break;

                                default:

                                    break;

                            }

                            links[key] = $("<a href='javascript:void(0);' class='jp-" + key + "'>" + value + "</a>").appendTo(_page).click(function () {

                                pageIndex = _pageIndex;

                                obj.PageCallback();

                            });

                        });

                        return links;

                    })();

 

                    //手动跳转

                    btnPage.click(function () {

                        var _pageindex = parseInt($.trim(txtPage.val()));

                        if (!!_pageindex && _pageindex <= pageCount) {

                            pageIndex = _pageindex;

 

                            obj.PageCallback();

                        }

                    });

 

                    _page.append(txtPage).append(btnPage);

 

                    if (pageIndex == 1) {

                        _a["first"].add(_a["prev"]).addClass("jp-disabled").unbind("click");

                    }

                    if (!pageCount || pageIndex == pageCount) {

                        _a["next"].add(_a["last"]).addClass("jp-disabled").unbind("click");

                    }

 

                    if (pageIndex <= 4) {

                        show_indexStart = 2;

                        show_End = 6;

                        omit.push(show_End);

                    } else if (pageIndex > pageCount - 4) {

                        show_indexStart = pageCount - 5;

                        show_End = pageCount - 1;

                        omit.push(show_indexStart - 1);

                    } else {

                        show_indexStart = pageIndex - 2;

                        show_End = pageIndex + 2;

                        omit.push(show_indexStart - 1);

                        omit.push(show_End);

                    }

 

                    for (var i = 1, length = pageCount; i <= length; i++) {

                        var _i = i,

                                __a = $("<a href='javascript:void(0);'>" + i + "</a>").insertBefore(_page.find("a.jp-next")).click(function () {

                                    pageIndex = parseInt(this.innerHTML);

                                    obj.PageCallback();

                                });

 

                        if (i == pageIndex) {

                            __a.addClass("jp-current").unbind("click");

                        }

 

                        if (i != 1 && i != length) {

                            if (i < show_indexStart || i > show_End) {

                                __a.addClass("jp-hidden");

                            }

                            if ($.inArray(i, omit) > -1) {

                                $("<span>...</span>").insertAfter(__a);

                            }

                        }

                    }

 

 

                }

            };

 

            $.pageflip.defaultVal = {

                pageSize: 15,

                PageCallback: "",

                PagePosition: "",

                pageLocalized: {

                    first: "<<",

                    prev: "<",

                    next: ">",

                    last: ">>"

                }

            };

        })(jQuery);

在项目中应用说明：

一：初始化选项

$.pageflip.defaultVal = {

                pageSize: 15,

                PageCallback: "",

                PagePosition: "",

                pageLocalized: {

                    first: "<<",

                    prev: "<",

                    next: ">",

                    last: ">>"

                }

            };

二：取得$.pageflip.defaults.pageSize ，$.pageflip.defaults.pageIndex – 1

三：调用paging函数，在加载列表的函数里调用$.pageflip.paging($.pageflip.defaults.pageIndex, data.TotalNum);

 

data.TotalNum表示列表的总条数