Java Web開發jsp顯示進階分頁效果詳解__架構

     許多網站都文章或其他類內容的分頁效果，初學者對於分頁的開發有時只會用代碼，而沒有深入瞭解代碼編寫前的商務邏輯結構，掌握好這個，我想，任何的效果的分頁都能自己解決……

     1、確立jsp分頁的內部邏輯結構：

       現在就採用標準MVC模式下的分頁做簡單介紹。首先資料庫裡我們查詢了一大堆的資料，列出來一個for迴圈（或者直接使用標籤迭代輸出<logic:interate）,可能資料是一行一行，在一個表格標籤中顯示（或許是div的嵌套），不管怎麼樣，拿出來的的資料要規定顯示多少行，超過了要分頁，我們點擊下一頁，或者一個頁碼，將請求傳遞給servlet（action……）進行業務處理，將處理後得到的那幾行資料（也就是點擊的要顯示的那一頁資料)在伺服器中轉寄到那個視圖顯示：

 request.getRequestDispatcher("xxx.jsp").forward(request, response);

servlet接受http地址的參數，通過request接受，要傳遞的參數主要有查詢的表名，要得到的該頁的頁數（查詢的內容更細時應該傳遞更多的其它參數），這些參數用於構建sql語句查詢資料庫中該頁的內容，如下是這個處理查詢一頁的java類：這裡為了方便操作，在bean中也放入兩商務邏輯處理方法，實際應用時應該將他們打包在一個專門的java類中：

package com.xxx.bean;import java.sql.*;import java.util.Vector;import com.xxx.util.DB;/* * 肖力 * 2012-7-7 * 主要用於前台顯示列表的分頁 * */public class Lists {private static Connection con=null;//聲明Connection引用private static Statement stat=null;//聲明Statement引用private static ResultSet rs=null;//聲明ResultSet引用private static int span=6;  //span每頁顯示多少行記錄private int curPage = 1;   //當前頁private String msgsql;      //private int totalPage; private int total;public int getTotal() {return total;}public void setTotal(int total) {this.total = total;}public int getCurPage(){//得到使用者當前頁return this.curPage;}public void setCurPage(int curPage){//記錄使用者當前頁this.curPage = curPage;}public void setSql(String sql){this.msgsql = sql;}public String getSql(){return this.msgsql;}public int getTotalPage(){return this.totalPage;}public void setTotalPage(int totalPage){this.totalPage = totalPage;}public static int getSpan() {return span;}public static  void setSpan(int i) {span = i;}//擷取要分頁處理的總頁數public static int getTotalPages(String sql){int totalPage=1;try{con=DB.getCon();stat=con.createStatement();rs=stat.executeQuery(sql); rs.next();int rows=rs.getInt(1);//System.out.println(rows);totalPage= rows/span;            if(rows%span!=0)            {            totalPage++;            }}catch(Exception e){e.printStackTrace();}finally{try{DB.closeCon();con.close();}catch(Exception e){e.printStackTrace();}}return totalPage;}//查詢指定SQL中結果的指定頁的結果集public  static Vector<String[]> getPageContent(int page,String sql){Vector<String[]> vcon = new Vector<String[]>();try{con=DB.getCon();stat=con.createStatement();//執行語句得到結果集            rs = stat.executeQuery(sql);            //擷取結果集的中繼資料            ResultSetMetaData rsmt = rs.getMetaData();            //得到結果集中的總列數            int count = rsmt.getColumnCount();            int start = (page-1)*span;            if(start!=0)            {            rs.absolute(start);            }int temp=0;            while(rs.next()&&temp<span)            {            temp++;            String[] str = new String[count];            for(int i=0;i<str.length;i++)            {            str[i] = rs.getString(i+1);            }            vcon.add(str);            }}catch(Exception e){e.printStackTrace();}finally{try{DB.closeCon();rs.close();            stat.close();            con.close();}catch(Exception e){e.printStackTrace();}}return vcon;}}

以上的bean中儲存了這個查詢的總頁數，當前頁碼，每頁顯示的數目等等屬性，另外的兩個操作方法是靜態方法，執行個體化該對象時可以對象直接調用,其中的資料庫代理類DB這裡就不寫了。
2、servlet處理客服端的查詢頁面請求並且回應

     大概步驟：接受參數；執行個體化List對象；構造sql語句並查詢；轉寄結果集到前台顯示；

      以下是範例程式碼：

String table=request.getParameter("table");String ftable=request.getParameter("ftable");int curPage =Integer.parseInt(request.getParameter("curPage")); //得到該欄目的數目String sql="";//得到該類的總頁數String sqlpage = "";sql="select * from  "+table+" where Attribute='"+ftable+"' order by ID desc";sqlpage = "select count(*) from "+table+" where Attribute='"+ftable+"'";//擷取總頁數和總條數int totalpage =Lists.getTotalPages(sqlpage);int total=ProDB.getCounts(sqlpage);if(curPage==0||curPage>totalpage){curPage=1;//當上下頁頁數不符合規定時將當前頁碼數置為1}//將得到的頁數和當前頁碼存到Bean中Lists list=new Lists();//執行個體化分頁類list.setCurPage(curPage);list.setTotalPage(totalpage);list.setTotal(total);//得到該頁的內容Vector<String[]> vlist=Lists.getPageContent(curPage,sql);if(vlist.size()==0){//沒有搜尋到該類問題的文章String msg= "還沒有該類的清單項目!!!";request.setAttribute("msg",msg);}request.setAttribute("vlist",vlist);request.setAttribute("list",list);request.setAttribute("ftable", ftable);request.setAttribute("table",table);request.getRequestDispatcher("list.jsp").forward(request, response);

這裡將查詢的結果集轉寄到了list.jsp頁面顯示：以下展示list頁面分頁表徵圖特殊效果。

3、關於前台分頁點擊效果展示

  大部分網站上的分頁點擊效果都是只有上一頁、下一頁、尾頁、末頁、或者加入一個提交文字框編寫頁碼展示，那就是如下的範例程式碼了：

                  <a href="ShowServlet?action=listly&curPage=1&jsp=liuyan_list" class="aaa" title="首頁">首頁</a>   <a href="ShowServlet?action=listly&curPage=<%=curPage-1%>&jsp=liuyan_list" class="aaa" title="上一頁">上一頁</a>   <a href="ShowServlet?action=listly&curPage=<%=curPage+1%>&jsp=liuyan_list"  class="aaa" title="下一頁">下一頁</a>   <a href="ShowServlet?action=listly&curPage=<%=totalpage%>&jsp=liuyan_list" class="aaa" title="末頁">末頁</a> 

至於顯示頁碼，並且頁碼隨著頁數變化而變化，就要處理一段較為複雜的商務邏輯結構，下面就此用許多scripted代碼在jsp頁面顯示吧：

<%      if (totalpage <= 4) {      for (int i = 1; i <= totalpage; i++) {      if (i == curPage) {      %><b><u><%=i%></u>. </b><%} else {%><a href="ShowServlet?action=listly&curPage=<%=i%>&jsp=liuyan_list" title="第<%=i %>頁"><%=i%></a>. <%}}%> (第<%=curPage%>/<%=totalpage%>頁)<%} else {for (int i = curPage; i < curPage + 4; i++) {if (curPage == 1) {if (i == curPage) {%><b><u>1</u>. </b><%} else {%>    <a href="ShowServlet?action=listly&curPage=<%=i%>&jsp=liuyan_list"  title="第<%=i %>頁"><%=i%></a>. <%}} else if (curPage > 1 && curPage < (totalpage - 1)) {if (i - 1 == curPage) {%> <b><u><%=i - 1%></u>. </b><%} else {%>   <a href="ShowServlet?action=listly&curPage=<%=i - 1%>&jsp=liuyan_list"  title="第<%=i-1 %>頁"><%=i - 1%></a>. <%}} else if (curPage > 1 && curPage == totalpage - 1) {if (i - 2 == curPage) {%> <b><u><%=i - 2%></u>. </b><%} else {%>   <a href="ShowServlet?action=listly&curPage=<%=i - 2%>&jsp=liuyan_list"  title="第<%=i-2 %>頁"><%=i - 2%></a>. <%}} else if (curPage == totalpage) {if (i - 3 == curPage) {%> <b><u><%=i - 3%></u>. </b><%} else {%>   <a href="ShowServlet?action=listly&curPage=<%=i - 3%>&jsp=liuyan_list"  title="第<%=i-3 %>頁"><%=i - 3%></a>. <%}}}%>       (第<%=curPage%>/<%=totalpage%>頁)<%      }   %>         共 <%=total %> 條記錄    </td>  </tr>

只顯示四個表徵圖，可以更改代碼實現更多。以上代碼在jsp頁面中，違背了MVC標準模式開發，有必要將它們封裝，這裡不詳細講述了。

效果圖如下：

 謝謝參觀。