为什么分页？
- 分页是一种将所有数据分段展示给用户的技术。用户每次看到的并不是全部数据，而是其中的一部分，如果在这部分数据中没有找到自己想要的内容，可以通过指定页码或是翻页的方式转换到其他内容，直到找到自己想要的内容为止。这种技术缩短了请求响应时间，而且也不会出现因数据过多导致页面冗长的情况，提高了用户体验。
分页的实现初步思路：异步
①为页面指定：能够显示的最多数据条数
②通过当前页码来确定显示的具体数据
③上一页、下一页事件异步进行数据更新
④当前页在异步中跟进更新
⑤获取页数，在第一页，和末页进行提示
在分页的基础上、添加模糊查询
①异步显示查询结果，需要跟分页融合
②sql语句的拼接实现条件添加
实例
在分页基础上添加了模糊查询的一个实例：
user_info表数据如下
首页：发送请求页（代码如下）
<%@ 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>Insert title here</title>
</head>
<script type="text/javascript" src="./js/jquery-1.8.3.min.js"></script>
<script type="text/javascript">
/*设置当前页页码为pageNo，初始为第一页*/
var pageNo=1;
/*设置总页数为pageTotal*/
var pageTotal;
/*开始定义page异步方法：实现的主要一步*/
function page(){
/*实现正确数据更新、就需要把即将更新的当前页添加到请求中*/
var path="./DataServlet?pageNo="+pageNo;
/*分别获取两个搜索框中的内容*/
var name=$("[name='name']").val();
var address=$("[name='address']").val();
/*要想实现查询关键字、必须把查询内容一并添加到请求中
1、有内容时，添加到请求当中
2、没有内容时，正常更新数据*/
if(name!=""&&name!=undefined){
path=path+"&name="+name;
}
if(address!=""&&address!=undefined){
path=path+"&address="+address;
}
/*异步应用*/
var object={
url:path,
type:"get",
success:function(data){
/*对响应反馈的数据进行处理
反馈的数据：
1、在响应类中实现了数据库连接，并进行了请求的转发（详情参照第二个代码块）
2、返回一个表格，和一个带着总页数的隐藏框（详情参照第三个代码块）
处理：
1、将表格插入到div标签中、实现局部更新的效果
2、从隐藏框中获取总页数*/
$("#page").html(data);
pageTotal=$("#pageTotal").val();
}
}
$.ajax(object);
}
/*直接执行一次，即页面初始：第一页数据表*/
page();
/*上一页事件方法
1、在第一页时、再次点击进行弹框提示，并直接结束方法
2、非第一页时、点击上一页更新当前页码并执行page异步方法更新数据*/
function up(){
if(pageNo==1){
alert("已经是第一页了");
return;
}
pageNo--;
page();
}
/*下一页事件方法
1、在末页时、再次点击进行弹框提示，并直接结束方法
2、非末页时、点击下一页更新当前页码并执行page异步方法更新数据*/
function down(){
if(pageNo==pageTotal){
alert("已经是最后一页了");
return;
}
pageNo++;
page();
}
/*查询方法：
1、点击查询执行查询方法
2、非初始化页面是、pageNo值直接调用page方法不会重置当前页码、所以需要额外初始化一下
3、执行page方法*/
function search(){
pageNo=1;
page();
}
</script>
<style>
/*设置表格样式*/
table{
border-spacing: 0px;
border-collapse:collapse;
}
td,th{
border: black 1px solid;
}
</style>
<body>
<!--搜索框表单
1、设置输入框name值以获取内容
2、为搜索按钮绑定事件
3、搜索框不能写在异步更新的内容中-->
<form>
<input name="name" placeholder="请输入用户名信息" />
<input name="address" placeholder="请输入地址信息" />
<input type="button" value="搜索" onclick="search()" />
</form>
<!--空div块：设置id值接收返回的表格-->
<div id="page"></div>
<!--上一页、下一页按钮：绑定事件、实现请求发送、异步更新-->
<input type="button" onclick="up()" value="上一页" />
<input type="button" onclick="down()" value="下一页" />
</body>
</html>
servlet响应类：DataServlet类
import java.io.IOException;
import java.sql.ResultSet;
import java.util.ArrayList;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import com.jd.util.DBUtil;
import com.jd.util.IResOut;
import com.jd.vo.UserInfo;
public class DataServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//设置编码
response.setCharacterEncoding("UTF-8");
//分别获取请求中的name值和address值
String name=request.getParameter("name");
String address=request.getParameter("address");
/*构造搜索时的sql语句需要添加的限制条件；
要求：
1、两个条件需要能够兼容
2、再内容为空时，语句不能出错*/
String where=" where 1=1 ";
if(name!=null) {
where=where+"and name like '%"+name+"%'";
}
if(address!=null) {
where=where+"and address like '%"+address+"%'";
}
//获取当前页并转为int型
int pageNo =Integer.parseInt(request.getParameter("pageNo"));
//设置页面能够显示的最多数据条数
int pageSize=3;
/*执行查询方法获得结果集合：
1、实现查询方法时，处理结果需要的接口
2、在实现接口方法时，对结果进行合理处理
3、拼接sql语句（详细注释见该句）
4、执行查询方法、获得结果集合
5、将结果集合添加进请求当中，在请求转发页面进行进一步处理*/
class ResOut implements IResOut{
List<UserInfo> list = new ArrayList<UserInfo>();
public void getres(ResultSet resultSet) {
try {
while(resultSet.next()) {
list.add(new UserInfo(resultSet.getInt("id"),resultSet.getString("name"),resultSet.getString("mobile"),resultSet.getString("address")));
}
} catch (Exception e) {
}
}
}
/*拼接sql语句：查询语句拼接限制条件
查询原理：
1、limit a,b：从第a条数据开始，一共显示b条数据
2、当前页减一*页面最多条数，即为此页应该显示的第一条数据的下标
3、页面最多条数即为需要显示的数据条数*/
String sql = "select * from user_info "+where+" limit "+(pageNo-1)*pageSize+","+pageSize+"";
ResOut resout =new ResOut();
DBUtil.select(sql, resout);
request.setAttribute("userInfo",resout.list);
/*执行查询方法获得总页数：
1、实现查询方法时，处理结果需要的接口
2、在实现接口方法时，对结果进行合理处理
3、拼接sql语句（详细注释见该句）
4、执行查询方法、获得总页数
5、添加至请求中，在请求转发页进行进一步处理*/
class CountResOut implements IResOut{
int count;
public void getres(ResultSet resultSet) {
try {
while(resultSet.next()) {
count=resultSet.getInt("count");
}
} catch (Exception e) {
}
}
}
//根据"count(id) count"获取计算总条数，并通过拟名得到该值
String sql2="select count(id) count from user_info"+where;
CountResOut countResOut=new CountResOut();
DBUtil.select(sql2, countResOut);
//获取总条数后进行计算得到总页数
int pageTotal= countResOut.count%3==0?countResOut.count/3:countResOut.count/3+1;
request.setAttribute("pageTotal", pageTotal);
//请求转发语句，转发到target.jsp
request.getRequestDispatcher("target.jsp").forward(request, response);
}
}
请求转发页：响应的反馈
<%@page import="javax.servlet.descriptor.TaglibDescriptor"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<table>
<tr>
<th>id(编号)</th>
<th>name(用户名)</th>
<th>mobile(手机号)</th>
<th>address(地址)</th>
<th>操作</th>
</tr>
<!--循环遍历出需要更新的内容-->
<c:forEach var="n" items="${userInfo }">
<tr>
<td>${n.id}</td>
<td>${n.name }</td>
<td>${n.mobile }</td>
<td>${n.address }</td>
<td><a>查看</a><a>编辑</a><a>删除</a></td>
</tr>
</c:forEach>
</table>
<!-- 隐藏框获取总页数值：目的，传值给初始页面 -->
<input type="hidden" id="pageTotal" value="${pageTotal }" />
代码执行流：
1、浏览器直接请求index.jsp页面，该页面执行page()方法，此时pageNo的值为1——>向DataServlet发送请求并将pageNo传到该Servlet——>Servlet收到请求，根据pageNo的值返回第一页数据和一共有多少页，并将这些数据通过request转发的方式转发到target.jsp页面——>target.jsp页面将第一页数据遍历出来并将总页数存到input中——>Web服务器响应结果——>浏览器执行index.jsp中$("#data").append(data);代码将结果显示index.jsp中在div内并给该jsp内pageTotal赋值，至此本次请求结束；
2、点击“上一页”按钮——>执行up()方法——>先判断当前是否为第一页，如果是则终止执行，否则pageNo减1——调用page()方法，执行过程回到第一步；
3、点击“下一页”按钮——>执行down()方法——>先判断当前是否为最后一页，如果是则终止执行，否则pageNo加1——调用page()方法，执行过程回到第一步；
实现效果：
来源：CSDN
作者：qiangzhogshou
链接：https://blog.csdn.net/qiangzhogshou/article/details/103477525