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({
visiblePages: 5,
currentPage: 1,
pageCount: 10,
fillSpace: true,
onPageChange: function(pageNumber, event) {
// 这里可以实现分页逻辑,比如通过Ajax加载数据
console.log('当前页:', pageNumber);
}
});
});
</script>
</head>
<body>
<div id="pagination"></div>
</body>
</html>
这个HTML代码示例展示了如何在网页中引入jqPagination
插件,并初始化一个基本的分页控件。当用户点击分页控件的页码或者导航按钮时,控制台会输出当前选中的页码。在实际应用中,你需要在onPageChange
回调函数中实现具体的分页逻辑,比如通过Ajax从服务器获取数据。
评论已关闭