jquery 封装的分页插件（包括上一页，下一页，跳转）

以下是一个简单的使用jQuery实现的分页插件示例。这个示例提供了基本的分页功能，包括上一页、下一页和页码跳转。

HTML 部分：

<div id="pagination"></div>

CSS 部分：

.pagination {
    user-select: none;
}
.pagination a {
    cursor: pointer;
    user-select: none;
    padding: 5px 10px;
    margin: 0 5px;
    border: 1px solid #ddd;
    text-decoration: none;
    color: #333;
}
.pagination a.active {
    background-color: #007bff;
    color: white;
    border-color: #007bff;
}
.pagination a:hover {
    background-color: #007bff;
    color: white;
}

jQuery 部分：

(function($) {
    $.fn.pagination = function(options) {
        var settings = $.extend({
            currentPage: 1,
            totalPages: 5,
            callback: function(page) { /* do something */ }
        }, options);
 
        this.each(function() {
            var $this = $(this);
            var $nav = $('<nav></nav>').addClass('pagination').appendTo($this);
            var $previous = $('<a href="#">&laquo; 上一页</a>').appendTo($nav);
            var $next = $('<a href="#">下一页 &raquo;</a>').appendTo($nav);
            var $goToPage = $('<input type="text" size="2" />').appendTo($nav);
            var $goButton = $('<a href="#">跳转</a>').appendTo($nav);
 
            function render(page) {
                settings.callback(page);
                $nav.find('a').removeClass('active');
                $nav.find('a[href="' + page + '"]').addClass('active');
            }
 
            $previous.on('click', function(e) {
                e.preventDefault();
                if (settings.currentPage > 1) {
                    render(settings.currentPage - 1);
                }
            });
 
            $next.on('click', function(e) {
                e.preventDefault();
                if (settings.currentPage < settings.totalPages) {
                    render(settings.currentPage + 1);
                }
            });
 
            $goButton.on('click', function(e) {
                e.preventDefault();
                var page = parseInt($goToPage.val(), 10);
                if (!isNaN(page) && page >= 1 && page <= settings.totalPages) {
                    render(page);
                }
            });
 
            for (var i = 1; i <= settings.totalPages; i++) {
                $('<a href="' + i + '">' + i + '</a>').appendTo($nav);
            }
 
            render(settings.currentPage);
        });
    };
})(jQuery);
 
// 使用方