Html分頁實現

      還是圍繞新項目來的，因為沒有統一的分頁控件，大家各寫各的，浪費時間不說，長的又千奇百怪，所以就把這個小活收回來了，亂七八糟寫了一通，還湊合能用。主要邏輯就是根據當前頁碼、分頁大小和記錄總數計算前兩頁后兩頁，以及上、下頁等對應的鏈接地址就可以了。代碼保存一下，以備后續完善。因公司不能上傳圖片，所以大家只好來個親自動手看一下效果了。

分頁控件需要讀取url中的“page”參數，在頁面中分頁的位置寫下以下語句就可以了

<%=******.Utility.Pager.Html(this.TotalCount, this.Page, 10) %>

CS代碼

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Web;

namespace ******.Utility
{
    /// <summary>
    /// 分頁
    /// </summary>
    public class Pager
    {
        ///<summary>
        ///分頁控件
        ///</summary>
        ///<param name="recordCount">記錄總數</param>
        ///<param name="pageIndex">分頁索引</param>
        ///<param name="pageSize">分頁大小</param>       
        /// <returns>返回分頁的Html代碼</returns>
        public static string Html(int recordCount, int pageIndex, int pageSize)
        {
            string result = string.Empty;

            pageSize = pageSize < 1 ? 10 : pageSize;
             pageIndex = pageIndex < 1 ? 1 : pageIndex;
             recordCount = recordCount < 1 ? 1 : recordCount;
 
            if (recordCount > pageSize)
             {
                 int pageCount = (recordCount % pageSize) == 0 ? (recordCount / pageSize) : (recordCount / pageSize) + 1;
 
                string pageLink = PageLinkConstruct();
 
                if (pageIndex > pageCount)
                 {
                     pageIndex = pageCount;
                 }
 
                string htmlLeftPage = string.Empty;
                 string htmlRightPage = string.Empty;
 
                //前兩頁
                 for (int i = 2; i > 0; i--)
                 {
                     if (pageIndex - i > 0)
                     {
                         htmlLeftPage += string.Format("<a href=\"{0}\">{1}</a>", string.Format(pageLink, (pageIndex - i)), pageIndex - i);
                     }
                 }
                 //后兩頁
                 for (int j = 1; j < 3; j++)
                 {
                     if (pageIndex + j <= pageCount)
                     {
                         htmlRightPage += string.Format("<a href=\"{0}\">{1}</a>", string.Format(pageLink, (pageIndex + j)), pageIndex + j);
                     }
                 }
 
                int prevPage = pageIndex - 1;
 
                if (prevPage < 1)
                 {
                     prevPage = 1;
                 }
 
                int nextPage = pageIndex + 1;
 
                if (nextPage > pageCount)
                 {
                     nextPage = pageCount;
                 }
 
                string leftHtml = string.Empty;
 
                if (pageIndex > 1)
                 {
                     leftHtml = string.Format("<a {0}>{1}</a><a {2}>{3}</a>{4}", string.Format("href=\"{0}\"", string.Format(pageLink, 1)), "首頁", string.Format("href=\"{0}\"", string.Format(pageLink, prevPage)), "上一頁", htmlLeftPage);
                 }
 
                string rightHtml = string.Empty;
 
                if (pageIndex < pageCount)
                 {
                     rightHtml = string.Format("{0}<a {1}>{2}</a><a {3}>{4}</a>", htmlRightPage, string.Format("href=\"{0}\"", string.Format(pageLink, nextPage)), "下一頁", string.Format("href=\"{0}\"", string.Format(pageLink, pageCount)), "尾頁");
                 }
 
                result = string.Format("<div class=\"htmlpager\">{0}<b>{1}</b>{2}</div>", leftHtml, pageIndex, rightHtml);              
             }
 
            return result;

}

        /// <summary>
        /// 構造翻頁Url
        /// </summary>
        /// <returns></returns>
        private static string PageLinkConstruct()
        {
            HttpContext hc = HttpContext.Current;

            StringBuilder sb = new StringBuilder();

            if (!string.IsNullOrEmpty(hc.Request.QueryString["page"]))
            {
                for (int i = 0; i < hc.Request.QueryString.Count; i++)
                {
                    if (hc.Request.QueryString.Keys[i] != "page")
                    {
                        sb.AppendFormat("{0}={1}", hc.Request.QueryString.Keys[i], hc.Request.QueryString[i].ToString());
                        sb.Append("&");
                    }
                    else
                    {
                        sb.Append("page={0}&");
                    }
                }
            }
            else
            {
                for (int i = 0; i < hc.Request.QueryString.Count; i++)
                {
                    sb.AppendFormat("{0}={1}", hc.Request.QueryString.Keys[i], hc.Request.QueryString[i].ToString());
                    sb.Append("&");
                }

                sb.Append("page={0}&");
            }

            if (sb.Length > 0)
            {
                sb.Remove(sb.Length - 1, 1);
            }

            var url = new UriBuilder();

            url.Scheme = hc.Request.Url.Scheme;
            url.Host = hc.Request.Url.Host;
            url.Port = hc.Request.Url.Port;
            url.Path = hc.Request.Url.AbsolutePath;
            url.Query = sb.ToString();

            return url.ToString();
        }
    }
}

CSS

DIV.htmlpager { MARGIN-TOP: 20px; MARGIN-BOTTOM: 10px}
DIV.htmlpager A {BORDER-RIGHT: #8db5d7 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #8db5d7 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: #8db5d7 1px solid; COLOR: #000; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #8db5d7 1px solid; TEXT-DECORATION: none}
DIV.htmlpager A:hover {BORDER-RIGHT: red 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: red 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: red 1px solid; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: red 1px solid}
DIV.htmlpager A:active {BORDER-RIGHT: red 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: red 1px solid; PADDING-LEFT: 5px; PADDING-BOTTOM: 2px; BORDER-LEFT: red 1px solid; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: red 1px solid}
DIV.htmlpager b {BORDER-RIGHT: #e89954 1px solid; PADDING-RIGHT: 5px; BORDER-TOP: #e89954 1px solid; PADDING-LEFT: 5px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; BORDER-LEFT: #e89954 1px solid; COLOR: #000; MARGIN-RIGHT: 2px; PADDING-TOP: 2px; BORDER-BOTTOM: #e89954 1px solid; BACKGROUND-COLOR: #ffca7d}