第一步：分页对象的封装（在分页类重写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>条记录，当前显示第 <i class=\"blue\">"+this.getCurrentPageNum()+" </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 }
第二步：在列表页编写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 }
