没有合适的资源?快使用搜索试试~ 我知道了~
Bootstrap Paginator分页插件与ajax相结合实现动态无刷新分页效果
7 下载量 42 浏览量
2020-09-02
07:18:54
上传
评论
收藏 46KB PDF 举报
温馨提示
试读
2页
主要介绍了Bootstrap Paginator分页插件与ajax相结合实现动态无刷新分页效果,非常不错,具有参考借鉴价值,感兴趣的朋友一起看下吧
资源推荐
资源详情
资源评论
Bootstrap Paginator分页插件与分页插件与ajax相结合实现动态无刷新相结合实现动态无刷新
分页效果分页效果
主要介绍了Bootstrap Paginator分页插件与ajax相结合实现动态无刷新分页效果,非常不错,具有参考借鉴价
值,感兴趣的朋友一起看下吧
Bootstrap Paginator分页插件下载地址:
DownloadVisit Project in GitHub
1.这是需要分页的页面放的这是需要分页的页面放的 js函数:函数:
<span style="font-size:14px;">function paging(page){
$.ajax({
type: "GET",
url: "${ctx}/api/v1/user/1/"+(page-1)+"/5",
dataType:"json",
success: function(msg){
....//省略(查询出来数据)
}
});
$.ajax({
type: "GET",
url:"${ctx}/api/v1/user/count/1",
dataType:"json",
success:function(msg){
var pages = Math.ceil(msg.data/5);//这里data里面有数据总量
var element = $('#pageUl');//对应下面ul的ID
var options = {
bootstrapMajorVersion:3,
currentPage: page,//当前页面
numberOfPages: 5,//一页显示几个按钮(在ul里面生成5个li)
totalPages:pages //总页数
}
element.bootstrapPaginator(options);
}
});
}</span>
页面:页面:
<span style="font-size:14px;"><ul class="pagination" id="pageUl">
</ul></span>
*li里面自动生成的
2.最重要也是最核心的是要自己改下最重要也是最核心的是要自己改下bootstrap-paginator.js源文件源文件,如下:
<span style="font-size:14px;">onPageClicked: function (event, originalEvent, type, page) {
//show the corresponding page and retrieve the newly built item related to the page clicked before for the event return
var currentTarget = $(event.currentTarget);
switch (type) {
case "first":
currentTarget.bootstrapPaginator("showFirst");
paging(page);
break;
//上一页
case "prev":
currentTarget.bootstrapPaginator("showPrevious");
paging(page);
break;
case "next":
currentTarget.bootstrapPaginator("showNext");
paging(page);
break;
case "last":
currentTarget.bootstrapPaginator("showLast");
paging(page);
break;
case "page":
currentTarget.bootstrapPaginator("show", page);
paging(page);
break;
}
},</span>
资源评论
weixin_38709100
- 粉丝: 4
- 资源: 958
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- 细胞的奇迹:吃出来的免疫力(美亚畅销书!作者的TED演讲播放量超300万次!《谷物大脑》作者、《三联生活周刊》推荐!吃下对的食物,改善你的... (Z-Library).azw3
- 智能手机产品拆解,使用mindmaster打开
- 11111111111111
- 统信系统ARM64依赖openssl-1.0.2版本的libssl.so.10和libcrypto.so.10文件
- 奥比中光python sdk
- 冯超楠17.py
- OCR识别-基于视觉注意力机制Attention实现的OCR识别算法-附项目源码-优质项目实战.zip
- Java 使用蒙特卡洛方法估算PI的近似值(源代码)
- main.cpp
- 电子木鱼小程序源码电子木鱼小程序源码
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功