基于jquery实现简单的分页控件

今天我要为大家分享一个基于jquery实现的简单分页控件——pagination.js 1.0版本。这个分页控件简洁实用，适合各种前端应用。

让我们欣赏一下它的预览效果。这个分页控件在默认情况下，当你点击某个页码时，url后面会加上"p页码"，这样的设计使得页面跳转更加直观。

这个分页控件有两个重要的参数需要大家注意。第一个参数是beforeRender，它在每个页码项呈现前被调用，参数是页码的jQuery对象。利用这个回调函数，我们可以在页码呈现前进行一些自定义处理，比如增加自己的属性等。如果你需要在点击页码时刷新页面，例如url为"default.aspx?index=页码"，也可以在这个回调函数里进行处理。

第二个参数是callback，它在点击页码时触发，参数是整个options。这个分页控件并不会在点击页码时自动发起ajax请求，所以需要我们自己处理。在options中，index就是本次点击的页码。如果我们的总数可能会变化，可以通过callback将options参数回传，重新设定总数即可。

这个分页控件的使用非常简单，只需要按照调用例子进行操作就可以了。无论是开发者还是初学者，都可以轻松上手。如果你对这个分页控件感兴趣，不妨试试看，相信它会给你带来不错的使用体验。

分页控件v1.0

日期：2015年8月26日

（函数（window，$） {

$.fn.pagination已被定义为一个功能强大的分页控件。让我们深入了解其功能和特点。

默认配置选项包括：

总数（count）：待分页的总数。

每页数量（size）：每页显示的数量。

当前页（index）：当前显示的页码。

左右显示的页码数量（lrCount）：当前页左右最多显示的页码数量。

首页、尾页、上一页和的文本（first、last、before和next）。

点击事件回调函数（callback）和渲染前的回调函数（beforeRender）。

当总数小于或等于0时，该控件不会执行任何操作。否则，它将根据配置选项生成一个包含页码的分页器，并将其附加到目标元素上。分页器包括首页、尾页、上一页和链接，以及连续的页码。用户可以通过点击这些链接来导航到不同的页面。

该控件具有一些独特的功能，例如根据配置选项动态生成页码，以及通过回调函数在点击事件时更新配置选项。它还允许用户自定义样式，以适应不同的设计需求。它还支持在鼠标悬停和点击时添加和删除类名，以实现交互效果。它是一个功能丰富、易于使用的分页控件，适用于各种应用场景。

接下来是具体的代码实现：

// 分页控件初始化函数

function initPagination(options) {

// 默认配置选项

var defaults = {

count: 0, // 总数

size: 10, // 每页数量

index: 1, // 当前页

lrCount: 5, // 当前页左右最多显示的数量

// 其他配置选项...

};

// 合并默认配置和用户提供的配置选项

var settings = $.extend({}, defaults, options);

// 计算总页数、当前页数等

var pageCount = Math.ceil(settings.count / settings.size);

var currentPage = settingsdex > 0 ? Math.min(settingsdex, pageCount) : 1;

// 创建分页器元素并初始化

var pager = $("