js页码分页

/***
* 生成页码,小于2时没有页码
* @param page 当前页(Number)
* @param totalPage 总页码(Number)
* @param pagerSelector 生成的页码所放置的id(String)
* @param callbackFunctionName 回调函数的名称,传‘’代表默认方法名loadPage,当页面存在多个分页时,可以自定义回调函数名称
* @param isParent 是否是父级作用域(boolean) true代表是父级页面,false代表当前页面 
* @returns 
*/
cpic.pager = function(page, totalPage, pagerIdSelector,callbackFunctionName,isParent) {
var maxShowPager = 7;
var pagePre = 3,pageAfter=3;
if(totalPage<2) {
if(isParent){
parent.document.getElementById(pagerIdSelector).innerHTML = "";
}else{
document.getElementById(pagerIdSelector).innerHTML = "";
}

} else if(page<=totalPage) {
var pager = '<ul><li ' + (page==1?' class="disabled"':'') + (page>1?' onclick="cpic.toPage(' + (1) + ',\''+callbackFunctionName+'\','+isParent+')" ':'') + '><a onclick="javascript:void(0);">首页</a></li><li' + (page==1?' class="disabled"':'') + (page>1?' onclick="cpic.toPage(' + (page-1) + ',\''+callbackFunctionName+'\','+isParent+')" ':'') + '><a href="javascript:void(0);" aria-label="Previous"><span aria-hidden="true"><</span></a></li>';
if(totalPage<=7) {
for(var i=1;i<=totalPage;i++) {
pager += '<li onclick="cpic.toPage(' + i + ',\''+callbackFunctionName+'\','+isParent+')" ' + (i==page?'class="active"':'') + '><a href="javascript:void(0);">' + i + '</a></li>';
}
}else {
if(page>pagePre && page<=totalPage-pageAfter) {
for(var i=page-pagePre;i<=page+pageAfter;i++) {
pager += '<li onclick="cpic.toPage(' + i + ',\''+callbackFunctionName+'\','+isParent+')" ' + (i==page?'class="active"':'') + '><a href="javascript:void(0);">' + i + '</a></li>';
}
}else if(page<=pagePre) {
for(var i=1;i<=maxShowPager;i++) {
pager += '<li onclick="cpic.toPage(' + i + ',\''+callbackFunctionName+'\','+isParent+')" ' + (i==page?'class="active"':'') + '><a href="javascript:void(0);">' + i + '</a></li>';
}
}else if(page>totalPage-pageAfter) {
for(var i=totalPage-maxShowPager+1;i<=totalPage;i++) {
pager += '<li onclick="cpic.toPage(' + i + ',\''+callbackFunctionName+'\','+isParent+')" ' + (i==page?'class="active"':'') + '><a href="javascript:void(0);">' + i + '</a></li>';
}
}
}
pager += '<li' + (page==totalPage?' class="disabled"':'') + (page<totalPage?' onclick="cpic.toPage(' + (page+1) + ',\''+callbackFunctionName+'\','+isParent+')" ':'') + '><a href="javascript:void(0);" aria-label="Next"><span aria-hidden="true">></span></a></li>';
pager += '<li' + (page==totalPage?' class="disabled"':'') + (page<totalPage?' onclick="cpic.toPage(' + totalPage + ',\''+callbackFunctionName+'\','+isParent+')" ':'') + '><a onclick="javascript:void(0);">尾页</a></li></ul>';
if(isParent){
parent.document.getElementById(pagerIdSelector).innerHTML = pager;
}else{
document.getElementById(pagerIdSelector).innerHTML = pager;
}
}else {
throw "当前页大于总页码";
}
};

cpic.toPage = function(page,callbackFunctionName,isParent) {
if(callbackFunctionName != null && callbackFunctionName != '' && callbackFunctionName != undefined && callbackFunctionName != "undefined"){
if(isParent){
eval('window.frames["rightContent"].cpic.' + callbackFunctionName+'(' + page + ')');	
}else{
eval('cpic.' + callbackFunctionName+'(' + page + ')');
}
}else{
if(isParent){
window.frames["rightContent"].cpic.loadPage(page);
}else{
cpic.loadPage(page);
}
}
};

cpic.loadPage = function() {
throw "方法需要在具体实现里重写";
};

栗子:

/***
* @override cpic.xybx.js
* 有分页的页面这个方法需要重写
*/
cpic.loadPage2 = function(page) {
controller.load(page);
};
//加载数据
this.load = function(page) {
cpic.ajax("a/b?" + Math.random(),{page:page,size:model.size},
function(data){
model.page = page;
model.totalPage = data.totalPage;
controller.drawTable(data.resultList);
cpic.pager(model.page, model.totalPage,"aa","loadPage2","bb");
});
};

  

posted @ 2021-03-04 15:38  南山下的采药人  阅读(89)  评论(0编辑  收藏  举报