jqPagination - 简洁易用的jQuery分页插件
<!DOCTYPE html>
<html>
<head>
<title>jqPagination 分页插件示例</title>
<link rel="stylesheet" href="path/to/jqPagination.css">
<script src="path/to/jquery.min.js"></script>
<script src="path/to/jqPagination.js"></script>
<script>
$(function() {
$('#pagination').jqPagination({
// 设置总页数
max_page: 100,
// 设置当前页
current_page: 1,
// 设置每页显示数目
items_per_page: 10,
// 设置连接点击事件
link_string: '/page/{page_number}',
// 设置是否显示首页和尾页
first: 'First',
last: 'Last',
// 设置是否显示上一页和下一页
prev: 'Prev',
next: 'Next',
// 设置是否显示页码
page_numbers: true,
// 设置回调函数
onChange: function(page_number) {
// 页面跳转逻辑
alert('跳转到第 ' + page_number + ' 页');
}
});
});
</script>
</head>
<body>
<div id="pagination"></div>
</body>
</html>这个代码示例展示了如何使用jqPagination插件创建一个简洁的分页控件，并提供了基本的自定义选项。当用户点击分页控件的页码或导航按钮时，会触发一个弹窗，显示用户当前选择的页码。这个例子可以作为开发者学习和实践如何在自己的项目中应用分页插件的起点。
评论已关闭