[JavaScript] 基于Jquery的分页对象 →→→→→进入此内容的聊天室

来自 , 2019-09-23, 写在 JavaScript, 查看 103 次.
URL http://www.code666.cn/view/76cf4ecb
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>Page对象</title>
  6. <style>
  7. .pageBox,.pageBox1{ text-align:center; height:25px; padding:15px 0;}
  8. .pageBox .pages a.up,.pageBox .pages a.down{ color:#6eb4ea; text-decoration:none; border:1px solid #ffffff; background:none;}
  9. .pageBox .pages a.else{ background:none; border:none;}
  10. .pageBox .pages a{ padding:3px 7px; border:1px solid #f3f6f6; background:#fdfdfd; margin:0 5px; color:#999999;}
  11. .pageBox .pages a:hover,.pageBox .pages a.hover{ background:#6eb4ea; border:1px solid #6eb4ea; color:#ffffff; text-decoration:none;padding:2px 7px; }
  12. pageBox .pages span{ padding:3px 7px; color:#999999;}
  13. .fiv_sep{ height:3px; float:left; width:100%; font-size:4px; line-height:2px;}
  14. </style>
  15. <script type="text/javascript" src="../jquery/jquery.js"></script><!--jquery支持1.4以上版本-->
  16. </head>
  17. <body>
  18. <h1>Page</h1>
  19. <div class="pageBox" id="pageBox"></div>
  20. <script type="text/javascript">
  21. /**
  22. * 分页对象
  23. * Email:zhengyun_an@163.com
  24. * msn:zhengyun_an@hotmail.com
  25. * QQ:214994708
  26. */
  27. var Page = {
  28.          /**
  29.             displayId//默认值显示区域Id为pageBox,可以不填
  30.                 pagesize//每页条数,默认是15条,可以不填                 
  31.                 totalsize//总条数
  32.                 curpage//当前页数
  33.                 simple//默认是false,true没有上一页和下一页,
  34.                 type//0默认走http跳转,1是jsp页面必须有pageCallBack(pageNum)函数,从1开始      
  35.                 url//链接地址,如果type出入1此处就可以不填
  36.                 例子:Page._run({totalsize:300,curpage:11,type:1,simple:true}
  37.                 */
  38.         _run:function(param){
  39.                 var totalpages = 1,//总页数
  40.                         displayId="#pageBox",//显示区域Id  
  41.                         pagesize=15,//每页条数                     
  42.                         totalsize=0,//总条数
  43.                         curpage=1,//当前页数       
  44.                         url="",//链接地址          
  45.                         type=0,//0默认走http跳转,1传入回调函数    
  46.                         simple=false;//简单版本,没有上一页和下一页
  47.                 if(param.type!=undefined)type=param.type;              
  48.                 if(param.displayId!=undefined)displayId=param.displayId;
  49.                 if(param.pagesize!=undefined)pagesize=param.pagesize;          
  50.                 if(param.totalsize!=undefined)totalsize=param.totalsize;
  51.                 if(param.curpage!=undefined)curpage=param.curpage;
  52.                 if(param.url!=undefined)url=param.url; 
  53.                 if(param.simple!=undefined)simple=param.simple;
  54.                 if(url.indexOf("?")==-1){
  55.                         url += "?1=1";
  56.                 }
  57.                 if(totalsize>0){
  58.                         totalpages = Page._getTotalPages(totalsize,pagesize);
  59.                         if(curpage>totalpages){curpage=totalpages;}//传入页数大于总页数,就按最后一页算
  60.                         if(totalpages>1){                              
  61.                                 var firstPage= simple?"":Page._builderPageArea(type,"up",url,curpage-1,"上一页",false,displayId),
  62.                                 lastPage = simple?"":Page._builderPageArea(type,"down",url,parseInt(curpage)+1,"下一页",false,displayId),pages = new Array();
  63.                                 if(curpage<=4){//第一页 无上一页
  64.                                         if(curpage!=1){pages.push(firstPage);}
  65.                                         if(totalpages>5){//总页数超过5
  66.                                                 for(var i=1;i<=5;i++){
  67.                                                         if(curpage==i){
  68.                                                                 pages.push(Page._builderPageArea(type,"",url,i,i,true,displayId));                                                             
  69.                                                         }else{
  70.                                                                 pages.push(Page._builderPageArea(type,"",url,i,i,false,displayId));
  71.                                                         }
  72.                                                 }
  73.                                                 pages.push('<span>...</span>');
  74.                                                 pages.push(Page._builderPageArea(type,"",url,totalpages,totalpages,false,displayId));                                  
  75.                                         }else{//总页数<=5的,列1,2,3,4,5
  76.                                                 for(var i=1;i<=totalpages;i++){
  77.                                                         if(curpage==i){
  78.                                                                 pages.push(Page._builderPageArea(type,"",url,i,i,true,displayId));
  79.                                                         }else{
  80.                                                                 pages.push(Page._builderPageArea(type,"",url,i,i,false,displayId));
  81.                                                         }                                              
  82.                                                 }
  83.                                         }                              
  84.                                         if(curpage!=totalpages)pages.push(lastPage);
  85.                                 }else if(totalpages-curpage<=4){//最后一页 无下一页                                    
  86.                                         if(curpage!=1){pages.push(firstPage);}
  87.                                         if(totalpages>5){//总页数超过5
  88.                                                 pages.push(Page._builderPageArea(type,"",url,1,1,false,displayId));
  89.                                                 pages.push('<span>...</span>');
  90.                                                 for(var i=totalpages-4;i<=totalpages;i++){
  91.                                                         if(curpage==i){
  92.                                                                 pages.push(Page._builderPageArea(type,"",url,i,i,true,displayId));
  93.                                                         }else{
  94.                                                                 pages.push(Page._builderPageArea(type,"",url,i,i,false,displayId));
  95.                                                         }
  96.                                                 }      
  97.                                                 if(totalpages!=curpage) {pages.push(lastPage);}                        
  98.                                         }else{//总页数<=5的,列1,2,3,4,5
  99.                                                 for(var i=1;i<=totalpages;i++){
  100.                                                         if(curpage==i){
  101.                                                                 pages.push(Page._builderPageArea(type,"",url,i,i,true,displayId));
  102.                                                         }else{
  103.                                                                 pages.push(Page._builderPageArea(type,"",url,i,i,false,displayId));    
  104.                                                         }                                                                                                      
  105.                                                 }
  106.                                                                 if(curpage!=totalpages)pages.push(lastPage);
  107.                                         }                      
  108.                                 }else{//有上一页和最后一页 且总页数肯定大于5                          
  109.                                         pages.push(firstPage); 
  110.                                         pages.push(Page._builderPageArea(type,"",url,1,1,false,displayId));    
  111.                                         pages.push('<span>...</span>');
  112.                                         for(var i=curpage-2;i<=curpage+2;i++){
  113.                                                 if(curpage==i){
  114.                                                         pages.push(Page._builderPageArea(type,"",url,i,i,true,displayId));             
  115.                                                 }else{
  116.                                                         pages.push(Page._builderPageArea(type,"",url,i,i,false,displayId));            
  117.                                                 }              
  118.                                         }      
  119.                                         pages.push('<span>...</span>');
  120.                                         pages.push(Page._builderPageArea(type,"",url,totalpages,totalpages,false,displayId));
  121.                                         pages.push(lastPage);
  122.                                 }
  123.                                 var result = new Array();                              
  124.                                 result.push('<div class="pages">');
  125.                                 result.push(pages.join(''));
  126.                                 result.push('</div>'); 
  127.                                 $(displayId).html(result.join(''));
  128.                         }                      
  129.                 }else{
  130.                 }              
  131.                
  132.         },
  133.         /**计算总页数*/
  134.         _getTotalPages:function(_totalsize,_pagesize){         
  135.                 if(_totalsize%_pagesize==0)
  136.                         return _totalsize/_pagesize;
  137.                 else
  138.                         return parseInt(_totalsize/_pagesize)+1;                       
  139.         },
  140.         /**构造分页的每个页数区域*/
  141.         _builderPageArea:function(type,textType,url,page,text,_focus,_displayId){      
  142.                 var hrefStr,href= new Array();
  143.                 if(type==0){
  144.                         href.push(url);
  145.                         href.push('&pagenum=');
  146.                         href.push(page);
  147.                 }else if(type==1){
  148.                         href.push('javascript:void(0);pageCallBack(\'');                                       
  149.                         href.push(page);
  150.                         href.push('\',\'');
  151.                         href.push(_displayId);
  152.                         href.push('\')');
  153.                 }
  154.                 hrefStr = href.join(''),result=new Array();            
  155.                 if(textType=='up'){
  156.                                 result.push('<a href="');
  157.                                 result.push(hrefStr);
  158.                                 result.push('" class="up">上一页</a>');                             
  159.                 }else if(textType=='down'){
  160.                                 result.push('<a href="');
  161.                                 result.push(hrefStr);
  162.                                 result.push('" class="down">下一页</a>');
  163.                 }else{
  164.                                 result.push('<a href="');
  165.                                 result.push(hrefStr);
  166.                                 if(_focus){
  167.                                         result.push('" style="background:#6EB4EA;color:#FFF;">');
  168.                                 }else{
  169.                                         result.push('">');
  170.                                 }
  171.                                 result.push(page);
  172.                                 result.push('</a>');
  173.                 }
  174.                 return result.join('');
  175.         }      
  176. };
  177. Page._run({totalsize:100,curpage:1,pagesize:10});
  178. </script>
  179. </body>
  180. </html>
  181.  
  182. //javascript/5786

回复 "基于Jquery的分页对象"

这儿你可以回复上面这条便签

captcha