java web 分页技术_Java Web 之分页技术

实现分页中的虽然能提供分页，但是需要手动在地址栏输入第几页，这显然对用户极不友好，不过别急，上面只是实现了分页的效果。

很多网站都提供了分页功能，分页页面效果：

首页 上一页 1 2 3 4 5 6 7 下一页 尾页

上面的工具条只适用页数很少的业务，google查询的页数有上万页，不可能全部显示在页面上，也不可能提供“尾页”这个选项，所以以当前页为中心，提供前后5页的跳转链接，下面是一种可借鉴的分页工具条(假设当前页数为10)：

上一页 5 6 7 8 9 10 11 12 13 14 15 下一页

谷歌的分页工具条：

现在一般的做法，分页查询都会用单独类来封装查询结果

PageBean ----- 在业务层返回数据返回PageBean对象

public class PageBean {

public static final int NUMPERPAGE = 10; // 每页多少条

private int pNum; // 当前第几页

private int totalPageNum; // 总页数

private int totalRecordNum; // 总记录数

private List customers; // 结果数据

public int getpNum() {

return pNum;

}

public void setpNum(int pNum) {

this.pNum = pNum;

}

public int getTotalPageNum() {

return totalPageNum;

}

public void setTotalPageNum(int totalPageNum) {

this.totalPageNum = totalPageNum;

}

public int getTotalRecordNum() {

return totalRecordNum;

}

public void setTotalRecordNum(int totalRecordNum) {

this.totalRecordNum = totalRecordNum;

}

public List getCustomers() {

return customers;

}

public void setCustomers(List customers) {

this.customers = customers;

}

}

于是，在CustomerService修改pageQuery(int pNum)方法：

public static final int NUMBERPAGE = 10; // 设置每页条数为常量

public PageBean pageQuery(int pNum) {

// 根据页码 和 每页条数 计算开始索引

int start = (pNum - 1) * NUMPERPAGE;

PageBean bean = new PageBean();

// 封装当前页码

bean.setpNum(pNum);

// 调用DAO进行分页查询 --- 结果数据

CustomerDAO customerDAO = new CustomerDAO();

List customers = customerDAO.findByPage(start,

PageBean.NUMPERPAGE);

bean.setCustomers(customers);

// 封装总记录条数，findTotalRecordNum()方法见下文

int totalRecordNum = customerDAO.findTotalRecordNum();

bean.setTotalRecordNum(totalRecordNum);

// 计算总页数，很常用！！！

int totalPageNum = (totalRecordNum + PageBean.NUMPERPAGE - 1)

/ PageBean.NUMPERPAGE;

bean.setTotalPageNum(totalPageNum);

return bean;

}

在CustomerDAO中新增findTotalRecordNum()方法：

// 查询总记录条数

public int findTotalRecordNum() {

String sql = "select count(*) from customer";

QueryRunner queryRunner = new QueryRunner(JDBCUtils.getDataSource());

// ScalarHandler

try {

// 因为结果集只有一行一列，所以这里应该用ScalarHandler

long totalRecordNum = (Long) queryRunner.query(sql,

new ScalarHandler(1));

return (int) totalRecordNum; // int表示的范围足够了

} catch (SQLException e) {

e.printStackTrace();

}

return 0;

}

于是，在PageQueryServlet中修改：

修改前：

List customers = customer Service.pageQuery(pNum);

// 传递结果进行显示

request.setAttribute("customers", customers);

request.getRequestDispatcher("/list.jsp").forward(request,

response);

修改后：

PageBean pageBean = customerService.pageQuery(pNum);

// 传递结果进行显示

request.setAttribute("pageBean", pageBean); // ${pageBean}

request.getRequestDispatcher("/page_list.jsp").forward(request,

response);

接下来就是编写JSP页面：

预期效果：

实现首页 上一页

首页 上一页

首页

上一页

实现下一页 尾页

下一页 尾页

下一页

尾页

实现 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

${i }

至此基本功能完成，但是显示的效果很差：

现在的问题是：根本不知道哪个是当前页，所以还要改进一下foreach中的代码：

${i }

${i }

现在即可清晰的显示当前页了(可用CSS/JavaScript进一步美化界面，功能实现到此为止)

实现输入页码跳转，在尾页代码的后面加入input：

对应的JavaScript代码：

function jump(){

// 获得用户输入页码

var pNum = document.getElementById("pNum").value;

location.href="/pageQuery?pNum=" + pNum;

}