版权声明:转载请注明出处https://blog.csdn.net/tomhavenocat https://blog.csdn.net/TomHaveNoCat/article/details/83109164
最近工作中在做一个分页列表的一个东西,要求在js中写,不多比比,直接上关键代码
htmlText=htmlText+'<div class="page">';
//重写分页列表
//一页的内容
var pageSize = parseInt(data.pageSize);
//总共多少条数据
var total_number = parseInt(data.totalCount);
//当前页
var page = parseInt(data.pageNo);
//分页列表中间夹几个页码
var pageLength = 5;
var pageTotal = (total_number % pageSize == 0 ? total_number
/ pageSize : (total_number - total_number % pageSize)
/ pageSize + 1);
if (pageTotal > 1) {
var start = 0;
//设置页码头
if ((page - page % pageLength) / pageLength == 0) {
start = 1;
} else if (page % pageLength == 0 && page / pageLength == 1) {
start = 1;
} else if (page % pageLength == 0 && page / pageLength > 1) {
start = (page / pageLength - 1) * pageLength + 1;
} else if ((page - page % pageLength) / pageLength != 0) {
start = ((page - page % pageLength) / pageLength)
* pageLength + 1;
}
//进行头一页设置
if (page > 1) {
htmlText =htmlText+'<a href="javascript:loadMore('+(page-1)+');" class="btn_prev">上一页</a>';
htmlText =htmlText+'<a href="javascript:loadMore(1);">1</a>';
} else {
htmlText =htmlText+'<a href="#" class="btn_prev">上一页</a>';
htmlText =htmlText+'<a href="#"; class="active">1</a>';
}
//前省略号
if (start - pageLength >= 0) {
htmlText =htmlText+'<a href="javascript:loadMore('+(start - pageLength)+');" title="'+ (start - pageLength) + '">...</a>';
}
//分页列表
for (var j = (start == pageTotal ? pageTotal - pageLength + 1
: start); j <= (start + pageLength - 1 <= pageTotal ? start
+ pageLength - 1
: pageTotal); j++) {
if(j!=1&&j!=pageTotal){
if (j == page) {
htmlText =htmlText+'<a class="active" href="javaScript:loadMore('+ j +')" title="' + j + '">' + j+ '</a>';
} else {
htmlText =htmlText+'<a href="javaScript:loadMore(' + j+')" title="' + j + '">' + j+ '</a>';
}
}
}
//省略点
if (pageTotal > start + pageLength - 1) {
htmlText =htmlText+'<a href="javaScript:loadMore('+ (start + pageLength) +')" title="'+ (start + pageLength) + '">...</a>';
}
//下一页
if (pageTotal > page) {
htmlText =htmlText+'<a href="javaScript:loadMore('+ (pageTotal)+')">'+pageTotal+'</a>';
htmlText =htmlText+'<a href="javaScript:loadMore('+ (page + 1)+')" class="btn_next">下一页</a>';
} else {
htmlText =htmlText+'<a class="active" href="#">'+pageTotal+'</a>';
htmlText =htmlText+'<a href="#" class="btn_next">下一页</a>';
}
}
htmlText=htmlText+'</div>';
now,做出来后效果如下