当前位置:Gxlcms > JavaScript > 详细介绍bootstrappaginator分页实例代码

详细介绍bootstrappaginator分页实例代码

时间:2021-07-01 10:21:17 帮助过:3人阅读

这篇文章主要为大家详细介绍了bootstrap paginator分页前后台用法示例,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

bootstrap paginator分页前后台用法示例,供大家参考,具体内容如下

准备工作:

bootstrap-paginator.js 插件
github开源项目百度自行下载

引入js文件(JQuery1.8+bootstrap.min.js+bootstrap.css+bootstrap-paginator.js)


<!--路径根据自己项目修改-->
<link rel="stylesheet" href="/bootstrap/css/bootstrap.css" rel="external nofollow" >
<script type="application/javascript" src="/js/jquery-3.2.1.min.js"></script>
<script type="application/javascript" src="/bootstrap/js/bootstrap.min.js"></script>
<script type="application/javascript" src="/bootstrap/js/bootstrap-paginator.min.js"></script>


<!--jsp页面只需一个 ul 给定 class 和 id-->
<ul class="pagination" id="page"></ul>

JS 中列表页面请求

各种异步请求都适用(本例采用angular的 $http 请求)
options 是插件的各项设置
bootstrapMajorVersion:3 版本声明必须
onPageClicked:点击页数,page就是当前页
itemTexts属性将<<等符号替换为上一页等文字(不写也可以)


后台操作

分页之后的数据
总记录数或总页数


以上就是详细介绍bootstrap paginator分页实例代码的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行