使用bootstrap-paginator。js分页来进行ajax异步分页请求
具体的做法如下:
首先定义一个异步提交请求的ajax函数,其完整的函数如下:
=$ var国家免疫日(“# lbnid”) .val ();//获取当前新闻编的号
var cpage=1;//当前页面号
var tpage=10;//总页面数
函数getPaging () {
getComment (cpage);//获取新闻评论
}//点击查看新闻评论
$ (" # one2”)。点击(函数(){
getPaging ();
})；//获取新闻评论评论
函数getComment(页面){
. ajax({美元
类型:“获得”,
,数据:国家免疫日
异步:“false”,
url:“=/评论/GetComment& # 63;国家免疫日”+“,页面=" + +国家免疫日页面,
成功:函数(信息){
changeModel(信息);//更新局部页面
var totalpage=$ (" # totalpage”) .val ();//当前页面号
var curtpage=$ (" # curtpage”) .val ();//总页面号
如果(curtpage,,totalpage) {
cpage=curtpage;
tpage=totalpage;
}
显示器(cpage tpage);//显示评论
},
错误:函数(){
alert("加载失败!请稍后重试!”);
}
})；
}/* obj: ajax返回的html数据*///更新局部页面
函数changeModel (obj) {
comt=$ var (“.Comments”);
comt.replaceWith (“& lt; div类=Comments>”+ obj +“& lt;/div>”);
}/* curreentpage:当前页面号;tpage:总的页面数*///显示新闻评论
函数显示(curtpage tpage) {={var选项
bootstrapMajorVersion: 3//版本
当前页:curtpage,//当前页数//numberOfPages: 10日设置显示的页码数
totalPages: tpage,//总页数
itemTexts:函数(类型,页面,当前){
开关(类型){
例“第一”:
返回“首页”;
例“上一页”:
”返回上一页”;
例“下一步”:
回报”下一页”;
“最后”:
返回“末页”;
例“页面”:
返回页面;
}
},
}
$(" # "页).bootstrapPaginator(选项);
}
接下来就是修改原来的bootstrap-paginator。js文件,这也是最关键的一步
onPageClicked:函数(事件、originalEvent类型,页面){//显示相应的页和检索相关的新建项目页面点击返回之前的事件
var currentTarget=$ (event.currentTarget);
开关(类型){
例“第一”:
currentTarget.bootstrapPaginator (“showFirst”);
getComment(页面);//自定义的获取新闻评论的方法,一宝要记得添加这个自定义的函数
打破;
例“上一页”:
currentTarget.bootstrapPaginator (“showPrevious”);
getComment(页面);
打破;
例“下一步”:
currentTarget.bootstrapPaginator (“showNext”);
getComment(页面);
打破;
“最后”:
currentTarget.bootstrapPaginator (“showLast”);
getComment(页面);
打破;
例“页面”:
currentTarget。bootstrapPaginator(“秀”,页面);
getComment(页面);
打破;
}
},
接下来就好了。运行截图如下:
, 
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
