/*制作分页
*参数分别为,目标位置id,数据总数,当前页,每页显示条数,回调函数(即,点击分页按钮触发的方法)
*其中class为pagebar_1和pagebar_2的区别是能上一页和下一页能否点击,以及颜色变化
*/
function getPageBar(targetId,total,currPage,rows,func){
var totalPage=Math.ceil(total/rows);//总页数
var prePageBar='';
var nextPageBar='';
if(currPage==1){
prePageBar='<div class="pagebar_2"><</div>';
}else{
prePageBar='<div class="pagebar_1" οnclick="prePage('+func+','+currPage+','+rows+');"><</div>';
}
if(currPage==totalPage){
nextPageBar='<div class="pagebar_2">></div>';
}else{
nextPageBar='<div class="pagebar_1" οnclick="nextPage('+func+','+currPage+','+rows+');">></div>';
}
$("#"+targetId).html(prePageBar+nextPageBar);
}
//上一页
function prePage(func,currPage,rows){
func(currPage-1,rows);
}
//下一页
function nextPage(func,currPage,rows){
func(currPage+1,rows);
}
//在ajax返回数据成功之后,调用方法getPageBar,比如:
function zxscwj(page,rows){
$.ajax({
type : 'get',
url : '',
data:{
page:page,
rows:rows
},
success : function(data) {
//其他操作省略
var total=data.result.total;
getPageBar("pageBar_zxwj",total,page,rows,'zxscwj');
}
});
}
图片如图:
转载自原文链接, 如需删除请联系管理员。
原文链接:js简单分页,只有上一页和下一页,转载请注明来源!