导入
<!-- 分页模块 -->
<link href="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="pagination/css/htmleaf-demo1.css">
<script src="http://cdn.bootcss.com/jquery/1.11.0/jquery.min.js" type="text/javascript"></script>
<script>window.jQuery || document.write('<script src="pagination/js/jquery-1.11.0.min.js"><\/script>')</script>
<script type="text/javascript" src="pagination/js/jqPaginator.js"></script>
html
<div class="container">
<div class="row" style="min-height:500px;padding:2em 0;">
<p id="p1"></p>
<ul class="pagination" id="pagination1"></ul>
<!-- <p id="p2"></p>-->
<!-- <ul class="pagination" id="pagination2"></ul>-->
</div>
</div>
加载函数
<script type="text/javascript">
var num; // 当前页码
var totalPages; // 总页码
var u_num; // 用户数目
// 当前页码数据 不用动这里 后面调用
function usersInfo(pageIndex) {
$.ajax({
url: '/bookAllInfo',
type: 'GET',
dataType: 'json',
data: {
'accessType': '0',
'pageIndex': pageIndex
},
success: function (res) {
console.log(res)
var str = '';
for (i = 0; i < res.results.length; i++) {
// console.log(res.results[i].username);
str += "<tr><td>" + res.results[i].isbn + "</td>" +
"<td>" + res.results[i].title + "</td>" +
"<td>" + res.results[i].booktype + "</td>" +
"<td>" + res.results[i].position + "</td>" +
"<td>" + res.results[i].kucun + "</td>" +
"<td>" + res.results[i].weihuan + "</td>" +
"<td>" + res.results[i].publisher + "</td>" +
"<td><a class='tablelink' href='/changeBookInfo?key=" + res.results[i].isbn + "'>修改</a></td></tr>"
$("#content").html(str);
}
},
error: function () {
}
});
}
console.log(totalPages);
// 获取总页码
$.ajax({
url: '/books_num',
type: 'GET',
dataType: 'json',
success: function (res) {
books_num = res.books_num;
// 计算总页数
tp = books_num / 10;
// console.log(tp);
// if ((tp % 10) != 0) {
// console.log(tp - 1)
// tp += 1;
// }
// console.log("books_num:" + books_num);
tp = Math.ceil(tp);
$.jqPaginator('#pagination1', {
totalPages: 100,
visiblePages: 5,
currentPage: 1,
onPageChange: function (num, type) {
// $('#p1').text(type + ':' + num);
usersInfo(num)
}
});
},
error: function () {
}
});
</script>
下载地址:https://920.lanzous.com/iQBxam0o2yh
密码:etdc