jquery.pagination.js分页插件的使用
程序员文章站
2022-03-04 16:08:33
1、引用jquery.pagination.js 2、发送2次ajax请求，第一次需传入首页和页大小，返回数据得到所有数据的长度； ......
1、引用jquery.pagination.js
<script src="${ctx}/themes/b2b2cv2/doctor/js/message/jquery.pagination.js"></script>
2、发送2次ajax请求，第一次需传入首页和页大小，返回数据得到所有数据的长度；
第二次发送请求传入点击的页码号和页的大小，返回数据得到点击页的数据
参考链接：
1、https://blog.csdn.net/baidu_25343343/article/details/70478467
2、https://blog.csdn.net/Fanbin168/article/details/49847931
代码如下：
var pageSize = 2; //声明页大小的变量
var dataCount, pageCount;
$.ajax({
url: url,
type: 'POST',
data: {
pageSize: pageSize, //第一次ajax请求需传的参数
pageNumber: 1
},
dataType: 'json',
cache: false,
success: function(datas) {
console.log(datas.data.list);
if(datas.result == 1) {
var html = template('tpl', {
list: datas.data.list,
});
$(className).html(html);
}
dataCount = datas.data.count; //返回的数据获得数据库中所有数据的数量，
pageCount = Math.ceil(dataCount / pageSize)；//算出总页数
$('.M-box').pagination({
pageCount: pageCount, //总页数
coping: true,
homePage: '首页',
endPage: '末页',
prevContent: '<< 上一页',
nextContent: '下一页 >>',
callback: function(api) {
console.log(api.getCurrent())
var currentPage = api.getCurrent(); //获取当前点击的页码
$.ajax({
url: url,
type: 'POST',
data: {
pageSize: pageSize, //第二次请求需传入的参数（页码的长度及当前点击的页码）
pageNumber: currentPage
},
dataType: 'json',
cache: false,
success: function(datas) {
console.log(datas);
if(datas.result == 1) {
var html = template('tpl', {
list: datas.data.list
});
$(className).html(html);
}
},
error: function() {
alert("请求接口失败。")
}
})
}
});
},
error: function() {
alert("请求失败！！！")
}
})