自定义分页标签模拟谷歌模式

简介:

自定义标签分页,对于分页的显示方式有很多,简单的模拟一下谷歌的分页方式。

思路:
1.显示的数字个数可以设置,通过点击时要改变的数字个数决定
2.点击显示记录中的中间记录的前面的数字时记录信息不改变
3.点击显示记录中的中间记录的后面的数字时被点击的数字居中显示,并且显示记录更新
4.当前显示记录为最顶信息则不显示上一页,当前显示记录为最末信息则不显示下一页

第一步:创建一个自定义标签的标签类

 
  1. 分页标签的标签类:  
  2. import javax.servlet.jsp.JspException;  
  3. import javax.servlet.jsp.tagext.TagSupport;  
  4.  
  5. import java.io.IOException;  
  6. import java.text.MessageFormat;  
  7.  
  8. public class DivPageByNumber extends TagSupport {  
  9.     // 显示的页面的url;  
  10.     private String url;  
  11.     // 显示的页码  
  12.     private int page;  
  13.     // 要显示的页码数  
  14.     private int totalPages;  
  15.     // 每次改变的页码数  
  16.     private int changePages;  
  17.     private String upPage="上一页";  
  18.     private String nextPage="下一页";  
  19.  
  20.     /**  
  21.      * 标签开始执行,该标签没有标签体  
  22.      */ 
  23.     @Override 
  24.     public int doStartTag() throws JspException {  
  25.         int indexStart = page - changePages;  
  26.         int indexEnd = page + changePages;  
  27.         if (indexStart <=1) {  
  28.             indexStart = 1;  
  29.         }  
  30.         if (indexEnd > totalPages) {  
  31.             indexEnd = totalPages;  
  32.         }  
  33.         /**  
  34.          * 如果显示的页面是第一页则不用显示下一页  
  35.          */ 
  36.         if(indexStart>1){  
  37.             String [] linkUp={url, String.valueOf(indexStart-changePages) ,upPage};  
  38.             printLink(linkUp);  
  39.             printModify("&nbsp;&nbsp;&nbsp;");  
  40.         }  
  41.         /**  
  42.          *显示输出的的数字的个数包含首尾数字所以一次显示的数字个数是一次改变的数字数加1  
  43.          */ 
  44.         for (int i = indexStart; i <= indexEnd; i++) {  
  45.             String[] object = { url, String.valueOf(i), String.valueOf(i) };  
  46.             printLink(object);  
  47.             printModify("&nbsp;&nbsp;&nbsp;");  
  48.         }  
  49.         /**  
  50.          * 如果显示的页面是最后一页,则不用显示下一页  
  51.          */ 
  52.         if(indexEnd<totalPages){  
  53.             String [] linkNext={url, String.valueOf(indexEnd+changePages) ,nextPage};  
  54.             printLink(linkNext);  
  55.         }  
  56.  
  57.         return super.doStartTag();  
  58.     }  
  59.  
  60.     /**  
  61.      * 向页面输出每一页的数字连接  
  62.      * @param object  
  63.      */ 
  64.     private void printLink(String...object) {  
  65.         String linkString = "<a href={0}?page={1}>{2}</a>";  
  66.         String divPageString = MessageFormat.format(linkString, object);  
  67.         try {  
  68.             pageContext.getOut().write(divPageString);  
  69.         } catch (IOException e) {  
  70.             e.printStackTrace();  
  71.         }  
  72.     }  
  73.  
  74.     /**  
  75.      * 修饰输出  
  76.      * @param stringModify  
  77.      */ 
  78.     public void printModify(String stringModify){  
  79.         try{  
  80.             pageContext.getOut().write(stringModify);  
  81.         }catch(IOException e){  
  82.             e.printStackTrace();  
  83.         }  
  84.     }  
  85.       
  86.     public String getUrl() {  
  87.         return url;  
  88.     }  
  89.  
  90.     public void setUrl(String url) {  
  91.         this.url = url;  
  92.     }  
  93.  
  94.     public int getPage() {  
  95.         return page;  
  96.     }  
  97.  
  98.     public void setPage(int page) {  
  99.         this.page = page;  
  100.     }  
  101.  
  102.     public int getTotalPages() {  
  103.         return totalPages;  
  104.     }  
  105.  
  106.     public void setTotalPages(int totalPages) {  
  107.         this.totalPages = totalPages;  
  108.     }  
  109.  
  110.     public int getChangePages() {  
  111.         return changePages;  
  112.     }  
  113.  
  114.     public void setChangePages(int changePages) {  
  115.         this.changePages = changePages;  
  116.     }  
  117.  

第二步:配置tld文件

 

 
  1. 配置tld文件,添加自定义标签  
  2.     <tag>  
  3.         <name>divPageNumber</name>  
  4.         <tag-class>xiao.zhang.tag.DivPageByNumber</tag-class>  
  5.         <body-content>jsp</body-content>          
  6.         <attribute>  
  7.             <name>url</name>  
  8.             <required>true</required>  
  9.             <rtexprvalue>true</rtexprvalue>  
  10.         </attribute>  
  11.         <attribute>  
  12.             <name>page</name>  
  13.             <required>true</required>  
  14.             <rtexprvalue>true</rtexprvalue>  
  15.         </attribute>  
  16.         <attribute>  
  17.             <name>totalPages</name>  
  18.             <required>true</required>  
  19.             <rtexprvalue>true</rtexprvalue>  
  20.         </attribute>  
  21.         <attribute>  
  22.             <name>changePages</name><!--每次单击居中数字后面的数字时要改变的数字个数-->  
  23.             <required>true</required>  
  24.             <rtexprvalue>true</rtexprvalue>  
  25.         </attribute>  
  26.     </tag>  

配置其他环境:如果tld文件不在/WEB-INF/目录下则要在web.xml文件中添加自定义标签库的引用信息
根据tld中的信息添加:
  

 
  1. <jsp-config>  
  2.    <taglib>  
  3.     <taglib-uri>http://aiilive.blog.51cto.com/</taglib-uri>  
  4.     <taglib-location>/WEB-INF/tag.tld</taglib-location>  
  5.    </taglib>  
  6.   </jsp-config> 

实现的效果还行,就是后台数据库的处理方面要下功夫了。 

   

 

 分页技术在各种各样的网站上都随处看见,而且风格,显示,实现方式都不太一样 
对于分页而言其本身意义并不大。
  但是对于每一页显示的信息而言,好的分页实现机制可以:
  减少数据库的访问次数;
  加快页面的数据的加载调高访问速度;
  根据用户的需要而进行数据的显示从而减少不必要的数据库访问。
  等等


  分页技术的核心还是在于数据库中的数据如何根据页面的请求更加有效,快速返回
给用户请求。



本文转自 secondriver 51CTO博客,原文链接:http://blog.51cto.com/aiilive/841127,如需转载请自行联系原作者

相关文章
|
5月前
|
供应链 搜索推荐
偏好类标签支持自定义统计方式,标签场景覆盖更广
在个性化营销场景,零售商必须理解顾客的行为才能更准确的预测客户需求,优化库存管理、制定营销策略,并提供个性化的购物体验,然而偏好类标签的加工不仅仅是简单的属性出现频次或最大值的统计,Dataphin V4.0版本新增了自定义统计的方式加工偏好标签,通过简单的配置即可完成复杂的标签加工场景。
|
Web App开发 人工智能 算法
为什么GNE 不做全自动提取列表页的功能
为什么GNE 不做全自动提取列表页的功能
97 0
|
存储 开发框架 前端开发
ModStartCMS v5.5.0 页面标签支持,用户逻辑优化
ModStart 是一个基于 Laravel 模块化极速开发框架。模块市场拥有丰富的功能应用,支持后台一键快速安装,让开发者能快的实现业务功能开发。
|
小程序
小程序实战之搜索框组件的封装与模糊搜索的实现
点击搜索框,跳转到搜索页,输入搜索词,可以获取到相关信息并渲染,从设计上来讲,整个需求需要拆分为两个核心步骤即搜索框组件封装与模糊搜索,下面将从这两部分来讲。
372 0
小程序实战之搜索框组件的封装与模糊搜索的实现
“关联表单”组件文本数据筛选只支持包含条件的解决方案
在“关联表单”中使用数据筛选功能筛选文本时条件只有”包含“,此文章通过增加一个”下拉单选“组件,变相解决这个问题。
188 0
【Nest教程】为项目增加个自定义过滤器
【Nest教程】为项目增加个自定义过滤器
201 0
【Nest教程】为项目增加个自定义过滤器
医学四视图-007-增加按钮,增加文档提示
医学四视图-007-增加按钮,增加文档提示
278 0
医学四视图-007-增加按钮,增加文档提示
|
监控 JavaScript 前端开发
一个简单的小技巧,监控网页所有动态标签创建的调用处
一个简单的小技巧,监控网页所有动态标签创建的调用处
一个简单的小技巧,监控网页所有动态标签创建的调用处
如何使用配置的方式修改SAP C4C UI的字段标签,以及背后的工作原理
I was asked by one partner that it is expected to adapt the label of “New” button into “Add”, and change the text of first menu item from “Add” to “From Contact”.
如何使用配置的方式修改SAP C4C UI的字段标签,以及背后的工作原理
|
JavaScript 数据建模 数据格式
【自然框架】n级下拉列表框的原理
  其实原理也很简单,分成两个部分,一个是服务器端,一个是客户端。     首先要设置记录集,这里用DataSet来装载,二级联动,里面就要有两个DataTable;三级联动,里面就要有三个DataTable。
1201 0