一个封装好的CSS分页导航栏

效果请看 http://blog.csdn.net/greystar/archive/2008/04/08/2260363.aspx

page.css

#channel-page
{
height:22px;
margin:5px auto;
padding:0px;
text-align:center;
line-height:20px;
width:500px;
}

#channel-page ul#channel-page-show
{
line-height:20px;
margin: 0px auto;
list-style-type: none;

padding:0px;
text-align:center;
width:100%;
height:22px;
}
#channel-page ul#channel-page-show li
{
display: inline;
float: left;
width: 23px;
padding: 0px 2px;
margin:2px 0px;
height:20px;
text-align:center;

}
#channel-page ul#channel-page-show li a
{
border: solid 1px #999 ;
display: block;
font-weight: 700;
font-size: 12px;
width: 20px;
color: #666;
height:20px;
background-color: #fff;
text-align: center;
text-decoration: none;

}
#channel-page ul#channel-page-show li a:hover
{
font-size: 20px;
z-index: 100;
width: 40px;
line-height: 40px;
position: absolute;
height: 40px;
margin-top: -10px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: -10px;
background-color: #fff;

}
#channel-page ul#channel-page-show li a.page-select
{
color: red;

}
#channel-page ul#channel-page-show li#channel-page-count
{
border: solid 1px #999 ;
font-weight: 700;
font-size: 12px;
width: 50px;
color: #666;
height:20px;
line-height:20px;
background-color: #fff;
text-align: center;
text-decoration: none;
padding :0px;
margin:2px 3px;
float:left;

}

#channel-page ul#channel-page-show li#channel-page-form
{
border: solid 1px #999 ;
display: block;
font-size: 12px;
width: 60px;
color: #666;
float:left;
background-color: #fff;
text-decoration: none;
padding: 0px;
margin-right: 1px;
margin-left: 2px;
white-space:nowrap;
vertical-align:middle;

}

#channel-page-form input#pagenum
{
width: 25px;
float:left;
border:solid 1px #FFF ;
vertical-align:middle;
margin:0px 0px;
color: #666;
}
#channel-page-form input#navButton
{

width: 25px;
float:left;
background-color: #FFF;
font-size: 14px;
border: 1px solid #FFF;
color: #666;
height:20px;
}

pagebar.cs代码如下

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Text;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace Finstone.Common.Control
{
[DefaultProperty("Text")]
[ToolboxData("<{0}:PageBar runat=server></{0}:PageBar>")]
public class PageBar : WebControl
{
public PageBar() : base(HtmlTextWriterTag.Div) {

this.Style.Add("text-align", "center");
this.Style.Add("margin", "2px auto");


}
int page = 1;
[Bindable(true)]
[Category("Appearance")]
[DefaultValue("")]
[Localizable(true)]
public string Text
{
get
{
String s = (String)ViewState["Text"];
return ((s == null) ? String.Empty : s);
}

set
{
ViewState["Text"] = value;
}
}
protected override void OnLoad(EventArgs e)
{

base.OnLoad(e);
if (Page.Request.QueryString["page"] != null)
{
CurrentPage = int.Parse(Page.Request.QueryString["page"].ToString());
}
page = CurrentPage;
}
protected override void OnPreRender(EventArgs e)
{
string cssurl = this.Page.ClientScript.GetWebResourceUrl(this.GetType(), "Finstone.Common.pagebar.css");
Finstone.Common.Web.Util.AddCSS(cssurl, this.Page);

base.OnPreRender(e);
}

protected override void RenderContents(HtmlTextWriter output)
{

StringBuilder sb = new StringBuilder();

int num = 1;
int allcount = AllCount;
int pagesize = PageSize;


num = Finstone.Common.Web.Util.GetPageCount(allcount, pagesize); //根据页尺寸来算出有多少页

int szPage = page;

sb.Append("<div id=\"channel-page\">");
sb.Append("<ul id=\"channel-page-show\">");
sb.Append("<li id=\"channel-page-count\">" + page + "/" + num + "</li>"); //全部页
sb.Append("<li><a target='_self' href='" + Finstone.Common.Web.Util.UpdateParam("page", "1") + "'>&lt;&lt;</a></li>");//第一页

if (szPage > 1)
{
sb.Append("<li><a target='_self' href='" + Finstone.Common.Web.Util.UpdateParam("page", (szPage - 1).ToString()) + "'>&lt;</a></li>");//上一页
}

//这里要算出开始页码和最后的页码 最多10页
int startIndex = 0;
int endIndex = 0;
if (szPage <= 10)
{
startIndex = 0;
endIndex = num < 10 ? num : 10;
}
else
{
startIndex = szPage - 5;
endIndex = num < szPage + 5 ? num : szPage + 5;
}

for (int i = startIndex; i <= endIndex - 1; i++)
{
int szContent = i + 1;
if (szContent == page)
{
sb.Append("<li><a class=\"page-select\" ' href='javascript:void(0);'>" + szContent + "</a></li>");
}
else
{
sb.Append("<li><a target='_self' href='" + Finstone.Common.Web.Util.UpdateParam("page", szContent.ToString()) + "'>" + szContent + "</a></li>");
}
}

if (szPage < num)
{
sb.Append("<li><a target='_self' href='" + Finstone.Common.Web.Util.UpdateParam("page", (szPage + 1).ToString()) + "'>&gt;</a></li>");//后一页
}

sb.Append("<li><a target='_self' href='" + Finstone.Common.Web.Util.UpdateParam("page", num.ToString()) + "'>&gt;&gt;</a></li>");//最后一页

if (ShowNavBar)
{
string s = "";
sb.Append("<li id=\"channel-page-form\">");
string url = RebuildUrl();
sb.Append("<input name=\"pagenum\" type=\"text\" id=\"pagenum\" maxlength=\"5\"><input type=\"button\" id=\"navButton\" value=\"GO\" onclick=\"var intstr=/^\\d+$/;if(intstr.test(pagenum.value)&&pagenum.value<=" + num + "&&pagenum.value>=1){location.href='" + url + "'+pagenum.value;}\"></li>");

}

sb.Append("</ul>");
sb.Append("</div>");

output.Write(sb.ToString());
}

string RebuildUrl()
{
string url = this.Page.Request.CurrentExecutionFilePath+"?";
if (this.Page.Request.QueryString.Count > 0)
{

foreach (string s in this.Page.Request.QueryString.AllKeys)
{
if (s.ToUpper() != "PAGE")
{
url += s + "=" + Page.Request.QueryString[s].ToString() + "&";
}
}
//url = url.TrimEnd('&');

}

url += "page=";

return url;
}
public int AllCount
{
get
{
if (ViewState["allcount"] == null)
return 0;
return (int)ViewState["allcount"];
}
set
{
ViewState["allcount"] = value;
}
}
public int CurrentPage
{
get {
if (ViewState["page"] == null)
return 1;
return (int)ViewState["page"];
}
set {
ViewState["page"] = value;
}

}

public int PageSize
{
get {
if (ViewState["pagesize"] == null)
return 10;
return (int)ViewState["pagesize"];

}
set {
ViewState["pagesize"] = value;
}

}

public bool ShowNavBar
{
get
{
if (ViewState["shownavbar"] != null)
{
return (bool)ViewState["shownavbar"];
}
else
return false;

}
set
{
ViewState["shownavbar"] = value;
}
}

}
}

AssemblyInfo.cs中加入下一行代码

[assembly: WebResource("Finstone.Common.pagebar.css", "text/css")]

注意,请将page.css文件作为资源文件,

用的时候只要设 AllCount Currentpage,pagesize 几个属性就可以了