javascript分頁演算法

㈠ 在JSP中如何實現分頁技術啊

title: JSP分頁技術實現
summary:使用工具類實現通用分頁處理
author: evan_zhao
email: [email protected]

目前比較廣泛使用的分頁方式是將查詢結果緩存在HttpSession或有狀態bean中，翻頁的時候從緩存中取出一頁數據顯示。這種方法有兩個主要的缺點：一是用戶可能看到的是過期數據；二是如果數據量非常大時第一次查詢遍歷結果集會耗費很長時間，並且緩存的數據也會佔用大量內存，效率明顯下降。
其它常見的方法還有每次翻頁都查詢一次資料庫，從ResultSet中只取出一頁數據（使用rs.last();rs.getRow()獲得總計錄條數，使用rs.absolute()定位到本頁起始記錄）。這種方式在某些資料庫(如oracle)的JDBC實現中差不多也是需要遍歷所有記錄，實驗證明在記錄數很大時速度非常慢。
至於緩存結果集ResultSet的方法則完全是一種錯誤的做法。因為ResultSet在Statement或Connection關閉時也會被關閉，如果要使ResultSet有效勢必長時間佔用資料庫連接。

因此比較好的分頁做法應該是每次翻頁的時候只從資料庫里檢索頁面大小的塊區的數據。這樣雖然每次翻頁都需要查詢資料庫，但查詢出的記錄數很少，網路傳輸數據量不大，如果使用連接池更可以略過最耗時的建立資料庫連接過程。而在資料庫端有各種成熟的優化技術用於提高查詢速度，比在應用伺服器層做緩存有效多了。

在oracle資料庫中查詢結果的行號使用偽列ROWNUM表示（從1開始）。例如select * from employee where rownum<10 返回前10條記錄。但因為rownum是在查詢之後排序之前賦值的，所以查詢employee按birthday排序的第100到120條記錄應該這么寫：
[pre] select * from (
select my_table.*, rownum as my_rownum from (
select name, birthday from employee order by birthday
) my_table where rownum <120
) where my_rownum>=100
[/pre]
mySQL可以使用LIMIT子句：
select name, birthday from employee order by birthday LIMIT 99,20
DB2有rownumber()函數用於獲取當前行數。
SQL Server沒研究過，可以參考這篇文章：http://www.csdn.net/develop/article/18/18627.shtm

在Web程序中分頁會被頻繁使用，但分頁的實現細節卻是編程過程中比較麻煩的事情。大多分頁顯示的查詢操作都同時需要處理復雜的多重查詢條件，sql語句需要動態拼接組成，再加上分頁需要的記錄定位、總記錄條數查詢以及查詢結果的遍歷、封裝和顯示，程序會變得很復雜並且難以理解。因此需要一些工具類簡化分頁代碼，使程序員專注於業務邏輯部分。下面是我設計的兩個工具類：
PagedStatement 封裝了資料庫連接、總記錄數查詢、分頁查詢、結果數據封裝和關閉資料庫連接等操作，並使用了PreparedStatement支持動態設置參數。
RowSetPage 參考PetStore的page by page iterator模式， 設計RowSetPage用於封裝查詢結果（使用OracleCachedRowSet緩存查詢出的一頁數據，關於使用CachedRowSet封裝資料庫查詢結果請參考JSP頁面查詢顯示常用模式）以及當前頁碼、總記錄條數、當前記錄數等信息， 並且可以生成簡單的HTML分頁代碼。
PagedStatement 查詢的結果封裝成RowsetPage。

下面是簡單的使用示例：

//DAO查詢數據部分代碼：
…
public RowSetPage getEmployee(String gender, int pageNo) throws Exception{
String sql="select emp_id, emp_code, user_name, real_name from employee where gender =?";
//使用Oracle資料庫的分頁查詢實現,每頁顯示5條
PagedStatement pst =new PagedStatementOracleImpl(sql, pageNo, 5);
pst.setString(1, gender);
return pst.executeQuery();
}

//Servlet處理查詢請求部分代碼：

…
int pageNo;
try{
//可以通過參數pageno獲得用戶選擇的頁碼
pageNo = Integer.parseInt(request.getParameter("pageno") );
}catch(Exception ex){
//默認為第一頁
pageNo=1;
}
String gender = request.getParameter("gender" );
request.setAttribute("empPage", myBean.getEmployee(gender, pageNo) );
…

//JSP顯示部分代碼
<%@ page import = "page.RowSetPage"%>
…
<script language="javascript">
function doQuery(){
form1.actionType.value="doQuery";
form1.submit();
}
</script>
…
<form name=form1 method=get>
<input type=hidden name=actionType>
性別：
<input type=text name=gender size=1 value="<%=request.getParameter("gender")%>">
<input type=button value=" 查詢 " onclick="doQuery()">
<%
RowSetPage empPage = (RowSetPage)request.getAttribute("empPage");
if (empPage == null ) empPage = RowSetPage.EMPTY_PAGE;
%>
…
<table cellspacing="0" width="90%">
<tr> <td>ID</td> <td>代碼</td> <td>用戶名</td> <td>姓名</td> </tr>
<%
javax.sql.RowSet empRS = (javax.sql.RowSet) empPage.getRowSet();
if (empRS!=null) while (empRS.next() ) {
%>
<tr>
<td><%= empRS.getString("EMP_ID")%></td>
<td><%= empRS.getString("EMP_CODE")%></td>
<td><%= empRS.getString("USER_NAME")%></td>
<td><%= empRS.getString("REAL_NAME")%></td>
</tr>
<%
}// end while
%>
<tr>
<%
//顯示總頁數和當前頁數(pageno)以及分頁代碼。
//此處doQuery為頁面上提交查詢動作的javascript函數名， pageno為標識當前頁碼的參數名
%>
<td colspan=4><%= empPage .getHTML("doQuery", "pageno")%></td>
</tr>
</table>
</form>

效果如圖：

因為分頁顯示一般都會伴有查詢條件和查詢動作，頁面應已經有校驗查詢條件和提交查詢的javascript方法（如上面的doQuery），所以RowSetPage.getHTML()生成的分頁代碼在用戶選擇新頁碼時直接回調前面的處理提交查詢的javascript方法。注意在顯示查詢結果的時候上次的查詢條件也需要保持，如<input type=text name=gender size=1 value="<%=request.getParameter("gender")%>">。同時由於頁碼的參數名可以指定，因此也支持在同一頁面中有多個分頁區。
另一種分頁代碼實現是生成每一頁的URL，將查詢參數和頁碼作為QueryString附在URL後面。這種方法的缺陷是在查詢條件比較復雜時難以處理，並且需要指定處理查詢動作的servlet，可能不適合某些定製的查詢操作。
如果對RowSetPage.getHTML()生成的默認分頁代碼不滿意可以編寫自己的分頁處理代碼，RowSetPage提供了很多getter方法用於獲取相關信息（如當前頁碼、總頁數、 總記錄數和當前記錄數等）。
在實際應用中可以將分頁查詢和顯示做成jsp taglib， 進一步簡化JSP代碼，屏蔽Java Code。

附：分頁工具類的源代碼， 有注釋，應該很容易理解。

1.Page.java
2.RowSetPage.java(RowSetPage繼承Page)
3.PagedStatement.java
4.PagedStatementOracleImpl.java(PagedStatementOracleImpl繼承PagedStatement)

您可以任意使用這些源代碼，但必須保留author [email protected]字樣

///////////////////////////////////
//
// Page.java
// author: [email protected]
//
///////////////////////////////////

package page;

import java.util.List;
import java.util.ArrayList;
import java.util.Collection;
import java.util.Collections;

/**
* Title: 分頁對象<br>
* Description: 用於包含數據及分頁信息的對象<br>
* Page類實現了用於顯示分頁信息的基本方法，但未指定所含數據的類型，
* 可根據需要實現以特定方式組織數據的子類，<br>
* 如RowSetPage以RowSet封裝數據，ListPage以List封裝數據<br>
* Copyright: Copyright (c) 2002 <br>
* @author [email protected] <br>
* @version 1.0
*/
public class Page implements java.io.Serializable {
public static final Page EMPTY_PAGE = new Page();
public static final int DEFAULT_PAGE_SIZE = 20;
public static final int MAX_PAGE_SIZE = 9999;

private int myPageSize = DEFAULT_PAGE_SIZE;

private int start;
private int avaCount,totalSize;
private Object data;

private int currentPageno;
private int totalPageCount;

/**
* 默認構造方法，只構造空頁
*/
protected Page(){
this.init(0,0,0,DEFAULT_PAGE_SIZE,new Object());
}

/**
* 分頁數據初始方法，由子類調用
* @param start 本頁數據在資料庫中的起始位置
* @param avaCount 本頁包含的數據條數
* @param totalSize 資料庫中總記錄條數
* @param pageSize 本頁容量
* @param data 本頁包含的數據
*/
protected void init(int start, int avaCount, int totalSize, int pageSize, Object data){

this.avaCount =avaCount;
this.myPageSize = pageSize;

this.start = start;
this.totalSize = totalSize;

this.data=data;

//System.out.println("avaCount:"+avaCount);
//System.out.println("totalSize:"+totalSize);
if (avaCount>totalSize) {
//throw new RuntimeException("記錄條數大於總條數？！");
}

this.currentPageno = (start -1)/pageSize +1;
this.totalPageCount = (totalSize + pageSize -1) / pageSize;

if (totalSize==0 && avaCount==0){
this.currentPageno = 1;
this.totalPageCount = 1;
}
//System.out.println("Start Index to Page No: " + start + "-" + currentPageno);
}

public Object getData(){
return this.data;
}

/**
* 取本頁數據容量（本頁能包含的記錄數）
* @return 本頁能包含的記錄數
*/
public int getPageSize(){
return this.myPageSize;
}

/**
* 是否有下一頁
* @return 是否有下一頁
*/
public boolean hasNextPage() {
/*
if (avaCount==0 && totalSize==0){
return false;
}
return (start + avaCount -1) < totalSize;
*/
return (this.getCurrentPageNo()<this.getTotalPageCount());
}

/**
* 是否有上一頁
* @return 是否有上一頁
*/
public boolean hasPreviousPage() {
/*
return start > 1;
*/
return (this.getCurrentPageNo()>1);
}

/**
* 獲取當前頁第一條數據在資料庫中的位置
* @return
*/
public int getStart(){
return start;
}

/**
* 獲取當前頁最後一條數據在資料庫中的位置
* @return
*/
public int getEnd(){
int end = this.getStart() + this.getSize() -1;
if (end<0) {
end = 0;
}
return end;
}

/**
* 獲取上一頁第一條數據在資料庫中的位置
* @return 記錄對應的rownum
*/
public int getStartOfPreviousPage() {
return Math.max(start-myPageSize, 1);
}

/**
* 獲取下一頁第一條數據在資料庫中的位置
* @return 記錄對應的rownum
*/
public int getStartOfNextPage() {
return start + avaCount;
}

/**
* 獲取任一頁第一條數據在資料庫中的位置，每頁條數使用默認值
* @param pageNo 頁號
* @return 記錄對應的rownum
*/
public static int getStartOfAnyPage(int pageNo){
return getStartOfAnyPage(pageNo, DEFAULT_PAGE_SIZE);
}

/**
* 獲取任一頁第一條數據在資料庫中的位置
* @param pageNo 頁號
* @param pageSize 每頁包含的記錄數
* @return 記錄對應的rownum
*/
public static int getStartOfAnyPage(int pageNo, int pageSize){
int startIndex = (pageNo-1) * pageSize + 1;
if ( startIndex < 1) startIndex = 1;
//System.out.println("Page No to Start Index: " + pageNo + "-" + startIndex);
return startIndex;
}

/**
* 取本頁包含的記錄數
* @return 本頁包含的記錄數
*/
public int getSize() {
return avaCount;
}

/**
* 取資料庫中包含的總記錄數
* @return 資料庫中包含的總記錄數
*/
public int getTotalSize() {
return this.totalSize;
}

/**
* 取當前頁碼
* @return 當前頁碼
*/
public int getCurrentPageNo(){
return this.currentPageno;
}

/**
* 取總頁碼
* @return 總頁碼
*/
public int getTotalPageCount(){
return this.totalPageCount;
}

/**
*
* @param queryJSFunctionName 實現分頁的JS腳本名字，頁碼變動時會自動回調該方法
* @param pageNoParamName 頁碼參數名稱
* @return
*/
public String getHTML(String queryJSFunctionName, String pageNoParamName){
if (getTotalPageCount()<1){
return "<input type='hidden' name='"+pageNoParamName+"' value='1' >";
}
if (queryJSFunctionName == null || queryJSFunctionName.trim().length()<1) {
queryJSFunctionName = "gotoPage";
}
if (pageNoParamName == null || pageNoParamName.trim().length()<1){
pageNoParamName = "pageno";
}

String gotoPage = "_"+queryJSFunctionName;

StringBuffer html = new StringBuffer("\n");
html.append("<script language=\"Javascript1.2\">\n")
.append("function ").append(gotoPage).append("(pageNo){ \n")
.append( " var curPage=1; \n")
.append( " try{ curPage = document.all[\"")
.append(pageNoParamName).append("\"].value; \n")
.append( " document.all[\"").append(pageNoParamName)
.append("\"].value = pageNo; \n")
.append( " ").append(queryJSFunctionName).append("(pageNo); \n")
.append( " return true; \n")
.append( " }catch(e){ \n")
// .append( " try{ \n")
// .append( " document.forms[0].submit(); \n")
// .append( " }catch(e){ \n")
.append( " alert('尚未定義查詢方法：function ")
.append(queryJSFunctionName).append("()'); \n")
.append( " document.all[\"").append(pageNoParamName)
.append("\"].value = curPage; \n")
.append( " return false; \n")
// .append( " } \n")
.append( " } \n")
.append( "}")
.append( "</script> \n")
.append( "");
html.append( "<table border=0 cellspacing=0 cellpadding=0 align=center width=80%> \n")
.append( " <tr> \n")
.append( " <td align=left><br> \n");
html.append( " 共" ).append( getTotalPageCount() ).append( "頁")
.append( " [") .append(getStart()).append("..").append(getEnd())
.append("/").append(this.getTotalSize()).append("] \n")
.append( " </td> \n")
.append( " <td align=right> \n");
if (hasPreviousPage()){
html.append( "[<a href='javascript:").append(gotoPage)
.append("(") .append(getCurrentPageNo()-1)
.append( ")'>上一頁</a>] \n");
}
html.append( " 第")
.append( " <select name='")
.append(pageNoParamName).append("' onChange='javascript:")
.append(gotoPage).append("(this.value)'>\n");
String selected = "selected";
for(int i=1;i<=getTotalPageCount();i++){
if( i == getCurrentPageNo() )
selected = "selected";
else selected = "";
html.append( " <option value='").append(i).append("' ")
.append(selected).append(">").append(i).append("</option> \n");
}
if (getCurrentPageNo()>getTotalPageCount()){
html.append( " <option value='").append(getCurrentPageNo())
.append("' selected>").append(getCurrentPageNo())
.append("</option> \n");
}
html.append( " </select>頁 \n");
if (hasNextPage()){
html.append( " [<a href='javascript:").append(gotoPage)
.append("(").append((getCurrentPageNo()+1))
.append( ")'>下一頁</a>] \n");
}
html.append( "</td></tr></table> \n");

return html.toString();

}
}

///////////////////////////////////
//
// RowSetPage.java
// author: [email protected]
//
///////////////////////////////////
package page;

import javax.sql.RowSet;

/**
* <p>Title: RowSetPage</p>
* <p>Description: 使用RowSet封裝數據的分頁對象</p>
* <p>Copyright: Copyright (c) 2003</p>
* @author [email protected]
* @version 1.0
*/

public class RowSetPage extends Page {
private javax.sql.RowSet rs;

/**
*空頁
*/
public static final RowSetPage EMPTY_PAGE = new RowSetPage();

/**
*默認構造方法，創建空頁
*/
public RowSetPage(){
this(null, 0,0);
}

/**
*構造分頁對象
*@param crs 包含一頁數據的OracleCachedRowSet
*@param start 該頁數據在資料庫中的起始位置
*@param totalSize 資料庫中包含的記錄總數
*/
public RowSetPage(RowSet crs, int start, int totalSize) {
this(crs,start,totalSize,Page.DEFAULT_PAGE_SIZE);
}

/**
*構造分頁對象
*@param crs 包含一頁數據的OracleCachedRowSet
*@param start 該頁數據在資料庫中的起始位置
*@param totalSize 資料庫中包含的記錄總數
*@pageSize 本頁能容納的記錄數
*/
public RowSetPage(RowSet crs, int start, int totalSize, int pageSize) {
try{
int avaCount=0;
if (crs!=null) {
crs.beforeFirst();
if (crs.next()){
crs.last();
avaCount = crs.getRow();
}
crs.beforeFirst();
}
rs = crs;
super.init(start,avaCount,totalSize,pageSize,rs);
}catch(java.sql.SQLException sqle){
throw new RuntimeException(sqle.toString());
}
}

/**
*取分頁對象中的記錄數據
*/
public javax.sql.RowSet getRowSet(){
return rs;
}

}

///////////////////////////////////
//
// PagedStatement.java
// author: [email protected]
//
///////////////////////////////////

package page;

import foo.DBUtil;

import java.math.BigDecimal;
import java.util.List;
import java.util.Iterator;
import java.util.Collections;

import java.sql.Connection;
import java.sql.SQLException;
import java.sql.ResultSet;
import java.sql.Statement;
import java.sql.PreparedStatement;
import java.sql.Timestamp;
import javax.sql.RowSet;

/**
* <p>Title: 分頁查詢</p>
* <p>Description: 根據查詢語句和頁碼查詢出當頁數據</p>
* <p>Copyright: Copyright (c) 2002</p>
* @author [email protected]
* @version 1.0
*/
public abstract class PagedStatement {
public final static int MAX_PAGE_SIZE = Page.MAX_PAGE_SIZE;

protected String countSQL, querySQL;
protected int pageNo,pageSize,startIndex,totalCount;
protected javax.sql.RowSet rowSet;
protected RowSetPage rowSetPage;

private List boundParams;

/**
* 構造一查詢出所有數據的PageStatement
* @param sql query sql
*/
public PagedStatement(String sql){
this(sql,1,MAX_PAGE_SIZE);
}

/**
* 構造一查詢出當頁數據的PageStatement
* @param sql query sql
* @param pageNo 頁碼
*/
public PagedStatement(String sql, int pageNo){
this(sql, pageNo, Page.DEFAULT_PAGE_SIZE);
}

/**
* 構造一查詢出當頁數據的PageStatement，並指定每頁顯示記錄條數
* @param sql query sql
* @param pageNo 頁碼
* @param pageSize 每頁容量
*/
public PagedStatement(String sql, int pageNo, int pageSize){
this.pageNo = pageNo;
this.pageSize = pageSize;
this.startIndex = Page.getStartOfAnyPage(pageNo, pageSize);
this.boundParams = Collections.synchronizedList(new java.util.LinkedList());

this.countSQL = "select count(*) from ( " + sql +") ";
this.querySQL = intiQuerySQL(sql, this.startIndex, pageSize);
}

/**
*生成查詢一頁數據的sql語句
*@param sql 原查詢語句
*@startIndex 開始記錄位置
*@size 需要獲取的記錄數
*/
protected abstract String intiQuerySQL(String sql, int startIndex, int size);

/**
*使用給出的對象設置指定參數的值
*@param index 第一個參數為1，第二個為2