分页的封装()-阿里云开发者社区

开发者社区> 开发与运维> 正文
登录阅读全文

分页的封装()

简介: 第一步:分页对象的封装(在分页类重写toString()方法,内部用stringBuffer字符串,动态拼接分页的html代码。在页面上${page}) 1 @Override 2 public String toString() { 3 Strin...

第一步:分页对象的封装(在分页类重写toString()方法,内部用stringBuffer字符串,动态拼接分页的html代码。在页面上${page})

 1     @Override
 2     public String toString() {
 3         StringBuffer pageHtml=new StringBuffer();
 4         pageHtml.append("<div class=\"pagin\">");
 5         pageHtml.append("<div class=\"message\">共<i class=\"blue\">"+this.getCountRecords()+"</i>条记录,当前显示第&nbsp;<i class=\"blue\">"+this.getCurrentPageNum()+"&nbsp;</i>页</div>");
 6         pageHtml.append("<ul class=\"paginList\">");
 7         //设置上一页
 8         if(getPrevPageNum()>0){
 9             pageHtml.append("<li class=\"paginItem\"><a href=\"javascript:void(0);\" onclick=\"pageTo('"+getPrevPageNum()+"')\"><span class=\"pagepre\"></span></a></li>");
10         }
11         for(Integer i:getListPages()){
12             String className="paginItem";
13             if(i.intValue() == getCurrentPageNum()){
14                 className="'paginItem current'";
15             }
16             pageHtml.append("<li class="+className+"><a href=\"javascript:void(0);\" onclick=\"pageTo('"+i+"')\">"+i+"</a></li>");
17         }
18         //设置(更多)...
19         if(!getListPages().contains(getCountPages())){
20             pageHtml.append("<li class=\"paginItem more\"><a href=\"javascript:void(0);\">...</a></li>");
21             pageHtml.append("<li class=\"paginItem\"><a href=\"javascript:void(0);\" onclick=\"pageTo('"+getCountPages()+"')\">"+getCountPages()+"</a></li>");
22         }
23         //设置下一页
24         if(getNextPageNum() > getCurrentPageNum()){
25             pageHtml.append("<li class=\"paginItem\"><a href=\"javascript:void(0);\" onclick=\"pageTo('"+getNextPageNum()+"')\"><span class=\"pagenxt\"></span></a></li>");    
26         }
27         
28         pageHtml.append("</ul>");
29         pageHtml.append("</div>");
30         return pageHtml.toString();
31     }
View Code

第二步:在列表页编写js代码。和分页的html代码结合使用。从而实现分页。

 1 /**
 2  *进入分页
 3  * @param num
 4  */
 5 function pageTo(num){
 6     var url;
 7     var href=window.location.href;
 8     var ind=href.lastIndexOf("&num");
 9     if(ind>0){
10         url=(href.split("&num"))[0];
11     }else{
12         url=(href.split("num"))[0];
13     }
14     var index=url.lastIndexOf("?");
15     if(index>0){
16         href=url+"&num="+num;
17     }else{
18         href=url+"?num="+num;
19     }
20     window.location.href=href;
21 }
View Code

 

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

分享:
开发与运维
使用钉钉扫一扫加入圈子
+ 订阅

集结各类场景实战经验,助你开发运维畅行无忧

其他文章