小伙伴们应该都知道,我们在项目开发中经常要用到分页功能,现在我们一般都会使用各种分页插件来进行快速实现。不过在面试的时候,面试官有时会问我们分页的实现过程与原理,这就有点让人防不胜防了。所以为了防止大家在面试时手足无措,索尔就用最原始的技术来带各位实现一下分页效果,希望能够让大家弄清楚分页的底层原理!
内容导读
本文的核心内容主要分为如下几部分:
程序结构
JSP页面设计
分页主要编码
效果展示
一. 程序结构
本项目虽小,但也是遵循三层架构的。对啦,不要忘了在项目中导入tomcat、JRE、mysql的依赖库文件,我这里用的是Eclipse工具。
因为项目中用到了JSP标签,所以我们需要在tomcat安装文件夹中的lib子文件夹下放好jstl-1.2.jar与standard.jar文件,如果有的话就不用管它了。项目的代码及依赖结构如下图所示:


二. JSP页面设计
接下来是本项目所用的jsp页面文件,主要有以下几个。
1. 创建index.jsp网页文件
- <%@ page language="java" contentType="text/html;
- charset=utf-8" pageEncoding="utf-8"%>
- <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
- <!DOCTYPE html PUBLIC "-//W3C//DTD
- HTML 4.01
- Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html;
- charset=utf-8">
- <title>我的信息查询</title>
- <link rel="stylesheet"
-
- type="text/css" href="css/index.css" rel="external nofollow">
- </head>
- <body>
- <h2>信息分页查询</h2>
-
- <div class="wrap">
- <table class="tab" border="2">
- <tr>
- <th>学号</th>
- <th>姓名</th>
- <th>成绩</th>
- </tr>
- <c:forEach items="${pg.list}" var="stu">
- <tr>
- <td><c:out value="${stu.sid}" /></td>
- <td><c:out value="${stu.sname}" /></td>
- <td><c:out value="${stu.score}" /></td>
- </tr>
- </c:forEach>
- </table>
- </div>
-
- <div class="set">
- 第<span id="currentPage">${pg.currentPage}</span>页 共<span
- id="totalPage"> ${pg.totalPage}
-
- </span>页 <a
- href="index?currentPage=${0}">首页</a> <a
- href="index?currentPage=${pg.currentPage-1}">上一页</a> <a
- href="index?currentPage=${pg.currentPage+1}">下一页</a> <a
- href="index?currentPage=${pg.totalPage}">尾页</a>转到第:<input id="jump"
- type="text" />页 <input id="go" type="button" value="GO" />
- </div>
- </body>
- <script type="text/javascript" src="js/index.js"></script>
- </html>
2. play.jsp文件
- <%@ page language="java" contentType="text/html;
- charset=utf-8"
- pageEncoding="utf-8"%>
- <!DOCTYPE html PUBLIC "-//W3C//DTD
- HTML 4.01
- Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html;
- charset=utf-8">
- <title>查询系统</title>
- </head>
- <body>
- <jsp:forward page="index"></jsp:forward>
- </body>
- </html>
三. 分页主要编码
1. 创建分页文件Pagination
- public class Pagination<T> {
-
- private int currentPage;
-
- // 总页号或总页数
- private int totalPage;
- // 每页记录数或行数
- private int limitRows;
- // 总的记录数或行数
- private int totalRows;
- // 每页开始的记录号
- private int startRecord;
- // 存每页中的记录
- private List<T> list;
-
- //初始化操作
- public void init() {
- // 1.1 求总页数,通过总记录数与每页行数来计算,有几种情况
- // (1)不够一页(2)有零头(3)刚好是整数页
- int tp = totalRows / limitRows;
- if (totalRows > limitRows) {
- totalPage = (totalRows %
-
- limitRows) == 0 ? tp : tp + 1;
- } else {
- totalPage = 1;
- }
-
- // 1.2 将当页保留在第一页或最后一页
- if (currentPage > totalPage) {
- currentPage = totalPage;
- } else if (currentPage <1) {
- currentPage = 1;
- }
-
- // 1.3 初始化开始记录数,mysql应用的limit它不包括开始记录,所以不要加1;
- // 还有limit传入的是开始记录号与查询的条数,此处是每页可显示数limitRows,
- // 如果查到最后没有limitRows限制的行数,则显示剩余部分
- this.startRecord = (currentPage -1) * limitRows;
- }
-
- public Pagination() {}
-
- // 当前页号,总记录数,每页行数;这些属性需要传入后初始化,其它的可以set设置
- public Pagination(int currentPage,int totalRows, int limitRows) {
- this.currentPage = currentPage;
- this.totalRows = totalRows;
- this.limitRows = limitRows;
- }
-
- // 以下为简单的get与set方法,我给省略了
- ......
2. 创建StuService类
- public class StuService {
-
- //2.1 拿到记录条数
- public static int getTotalRows() {
- Dao dao = new DaoImpl();
- return dao.getTotalRows();
- }
-
- //2.2 拿到每个分页数据
- public static List
getList(int startRecord, int limitRows) { - Dao dao = new DaoImpl();
- return dao.getList(startRecord, limitRows);
- }
-
- }
当然啦,还有数据库与表、实体类等也是需要我们创建的,大家可以根据项目需求自己去完成。
四. 效果展示
接下来就是本项目运行后的效果展示。

今天的内容就写到这里,现在你知道分页是怎么实现的了吗?