bootstrap 分页
来源:互联网 发布:java for mac os x 编辑:程序博客网 时间:2024/05/16 17:41
bootstrap分页
html代码
<html style="padding-bottom: 54px;"> <title>jquery</title> <script type="text/javascript"> $(function(){ $(".pagination").createPage({ totalPage:30, currPage:14, backFn:function(p){ console.log("回调函数:"+p); } }); })</script></head><body> <div class="pagec" id="pagearea"> <ul class="pagination"> </ul> </div></body></html>
javascript代码:
(function($){ var ms = { init:function(totalsubpageTmep,args){ return (function(){ ms.fillHtml(totalsubpageTmep,args); ms.bindEvent(totalsubpageTmep,args); })(); }, //填充html fillHtml:function(totalsubpageTmep,args){ return (function(){ totalsubpageTmep=""; // 页码大于等于4的时候,添加第一个页码元素 if(args.currPage!=1 && args.currPage>=4 && args.totalPage!=4) { totalsubpageTmep += "<li class='ali'><a href='javascript:void(0);' class='geraltTb_pager' data-go='' >"+1+"</a></li>"; } /* 当前页码>4, 并且<=总页码,总页码>5,添加“···”*/ if(args.currPage-2>2 && args.currPage<=args.totalPage && args.totalPage>5) { totalsubpageTmep += "<li class='ali'><a href='javascript:void(0);' class='geraltTb_' data-go='' >...</a></li>"; } /* 当前页码的前两页 */ var start = args.currPage-2; /* 当前页码的后两页 */ var end = args.currPage+2; if((start>1 && args.currPage<4) || args.currPage==1) { end++; } if(args.currPage>args.totalPage-4 && args.currPage>=args.totalPage) { start--; } for(; start<=end; start++) { if(start<=args.totalPage && start>=1) { totalsubpageTmep += "<li class='ali'><a href='javascript:void(0);' class='geraltTb_pager' data-go='' >"+start+"</a></li>"; } } if(args.currPage+2<args.totalPage-1 && args.currPage>=1 && args.totalPage>5) { totalsubpageTmep += "<li class='ali'><a href='javascript:void(0);' class='geraltTb_' data-go='' >...</a></li>"; } if(args.currPage!=args.totalPage && args.currPage<args.totalPage-2 && args.totalPage!=4) { totalsubpageTmep += "<li class='ali'><a href='javascript:void(0);' class='geraltTb_pager' data-go='' >"+args.totalPage+"</a></li>"; } $(".pagination").html(totalsubpageTmep); })(); }, //绑定事件 bindEvent:function(totalsubpageTmep,args){ return (function(){ totalsubpageTmep.on("click","a.geraltTb_pager",function(event){ var current = parseInt($(this).text()); ms.fillHtml(totalsubpageTmep,{"currPage":current,"totalPage":args.totalPage,"turndown":args.turndown}); if(typeof(args.backFn)=="function"){ args.backFn(current); } }); })(); } } $.fn.createPage = function(options){ ms.init(this,options); }})(jQuery);
0 0
- bootstrap分页
- bootstrap分页
- Bootstrap 分页
- bootstrap分页
- Bootstrap 分页
- bootstrap-分页
- bootstrap 分页
- bootstrap分页
- BootStrap 分页
- bootstrap分页
- Bootstrap分页
- bootstrap 分页
- Bootstrap分页插件--Bootstrap Paginator
- Bootstrap分页插件--Bootstrap Paginator
- bootstrap分页插件Bootstrap Paginator
- Bootstrap分页插件--Bootstrap Paginator
- bootstrap table 分页,客户端分页
- bootstrap分页样式
- 练习
- XML文档
- 计算长方形的周长和面积(类和对象)
- Leetcode-58. Length of Last Word
- FizzBuzzWhizz游戏
- bootstrap 分页
- 博客开始我的新生活
- 字符串 相等问题
- 蓝以中老师《高等代数》第04章:线性空间与线性变换 笔记
- 内核中_init,_exit中的作用
- 关于js表格datatable插件的使用心得
- 尾递归 or for循环?
- 【AC自动机】【bzoj3940】Censoring
- 冒泡排序--对指定的区间序列排序