ASP.NET AJAX：一步步打造漂亮的新聞列表（無重新整理分頁、內容預覽）（3）

前面兩個章節我們將需求分析和概要設計簡單介紹了，接下來是重點的編代 碼的階段了（實現無重新整理分頁）。在編寫代碼之前，一定要有計劃的去編寫代碼 ，不能一開始啥也不管就開始編代碼，除非你特牛。

我們來看一下需求分析：

3.==》無重新整理的分頁讀取新聞列表，在點擊下一頁的時候觸發事件，調用 ajax去資料庫中尋找下一頁的資料並返回，然後顯示在頁面上。

這裡面有兩個事件，都是js事件，我們用jquery代碼來實現。

分頁的話，我們採用jquery的分頁外掛程式pagination，官方地址為 http://plugins.jquery.com/project/pagination下載js檔案和css檔案（最下 面附下載地址）

先講講它的基本用法：

跟一般的jQuery外掛程式一樣，此外掛程式使用也很簡單便捷。方法是pagination， 例如$("#page").pagination(100);，這裡的100參數是必須的，表示顯示項目的 總個數，這是最簡單的使用。

例如下面的使用代碼：

$("#Pagination").pagination(56,　{
num_edge_entries:　2,
num_display_entries:　4,
callback:　pageselectCallback,
items_per_page:1
});

這段代碼錶示的含義是：總共有56(maxentries)個清單項目，首尾兩側分頁顯 示2(num_edge_entries)個，連續分頁主體數目顯示4(num_display_entries)個 ，回呼函數為pageselectCallback(callback)，每頁顯示的清單項目為 1 (items_per_page)。您可以對照參數表修改配置這裡的參數。

具體的用法可以參考官方文檔或是 http://www.cnblogs.com/aosiyelong/archive/2010/03/30/1700262.html

然後講講如何將它整合到我們這邊來。

在NewsList.aspx頁面中添加相關的js檔案和css檔案（最下面附下載地址） ：jquery-1.4.1.js，pagination.js

<link　type="text/css"　rel="Stylesheet"　 href="css/newsList.css"　/>
<link　type="text/css"　rel="Stylesheet"　 href="css/pagination.css"　/>
<script　src="js/jquery-1.4.1.js"　 type="text/javascript"></script>
<script　src="js/jquery.pagination.js"　 type="text/javascript"></script>