（转）博客园分页导航之我见

最新推荐文章于 2025-08-15 22:56:20 发布

转载最新推荐文章于 2025-08-15 22:56:20 发布 · 101 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/fcsh820/archive/2010/05/02/1726023.html

文章标签：

#javascript #ViewUI

本文详细介绍了分页导航控件的实现方式，包括四种不同的状态展示，并提供了相应的CSS样式和程序代码实现。文章还展示了如何根据不同条件生成对应的分页导航HTML标签。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

原文地址：http://www.cnblogs.com/hailibu/archive/2010/04/27/1721866.html

博客园里用的分页导航控件，我大胆地猜测应该是通过后台程序代码，然后在页面上输出html标签。我发现它与新浪的分页导航非常相像，不过后者是通过JavaScript创建分页导航。

这种分页导航有4种状态：

1、不带省略号的

2、省略号在右边

3、省略号在左边

4、省略号在两边

下面是我根据这4种状态，写出的分页导航代码，欢迎园友们多多指点^_^

CSS样式

#pager
{
font-size : 12px ;
margin : 25px 0 ;
text-align : center ;
color : #2E6AB1 ;
line-height : 200% ;
}
#pager a
{
border : 1px solid #9AAFE5 ;
color : #2E6AB1 ;
margin-right : 4px ;
padding : 2px 8px ;
text-decoration : none ;
}
#pager a:hover
{
border : 1px solid #2E6AB1 ;
color : #363636 ;
}
#pager span.current
{
background-color : #2E6AB1 ;
border : 1px solid navy ;
color : #FFFFFF ;
font-weight : bold ;
margin-right : 4px ;
padding : 2px 8px ;
}

页面代码：

< div id ="pager_block" >
< div id ='pager' >
分页导航Html标签存放位置
</ div >
</ div >

程序代码：

 
    001using System; 

    002using System.Collections.Generic; 

    003using System.Linq; 

    004using System.Web; 

    005using System.Text; 

    006  

    007public class Pager 

    008{ 

    009    /// <summary> 

    010    /// 创建分页导航Html标签 

    011    /// </summary> 

    012    /// <param name="pageIndex">索引页码,从1开始</param> 

    013    /// <param name="pageCount">总页数</param> 

    014    /// <param name="showPageCount">显示分页个数(奇数)</param> 

    015    /// <returns></returns> 

    016    public static string Build(int pageIndex, int pageCount, int showPageCount) 

    017    { 

    018        if (pageCount == 1) 

    019            return ""; 

    020  

    021        StringBuilder sb = new StringBuilder(); 

    022  

    023        int span = showPageCount / 2;  //前后对称的个数 

    024  

    025        int from, to; 

    026  

    027        if (pageCount > showPageCount + 1)  //导航中出现省略号 

    028        { 

    029            if (pageIndex <= span + 1)  //省略号出现在右边 

    030            { 

    031                from = 1; to = showPageCount; 

    032  

    033                if (pageIndex != 1) 

    034                    sb.AppendFormat("<a href='Default.aspx?page={0}'>上一页</a>", pageIndex - 1); 

    035  

    036                sb.Append(ShowPageNavigation(pageIndex, from, to)); 

    037  

    038                sb.Append("..."); 

    039  

    040                sb.AppendFormat("<a href='Default.aspx?page={0}'>{0}</a>", pageCount); 

    041  

    042                sb.AppendFormat("<a href='Default.aspx?page={0}'>下一页</a>", pageIndex + 1); 

    043  

    044            } 

    045            else if (pageIndex >= pageCount - span)  //省略号出现在左边 

    046            { 

    047                from = pageCount + 1 - showPageCount; to = pageCount; 

    048  

    049                sb.AppendFormat("<a href='Default.aspx?page={0}'>上一页</a>", pageIndex - 1); 

    050  

    051                sb.Append("<a href='Default.aspx'>1</a>"); 

    052  

    053                sb.Append("..."); 

    054  

    055                sb.Append(ShowPageNavigation(pageIndex, from, to)); 

    056  

    057                if (pageIndex != pageCount) 

    058                    sb.AppendFormat("<a href='Default.aspx?page={0}'>下一页</a>", pageIndex + 1); 

    059            } 

    060            else  //省略号出现在两边 

    061            { 

    062                from = pageIndex - span; to = pageIndex + span; 

    063  

    064                sb.AppendFormat("<a href='Default.aspx?page={0}'>上一页</a>", pageIndex - 1); 

    065  

    066                sb.Append("<a href='Default.aspx'>1</a>"); 

    067  

    068                sb.Append("..."); 

    069  

    070                sb.Append(ShowPageNavigation(pageIndex, from, to)); 

    071  

    072                sb.Append("..."); 

    073  

    074                sb.AppendFormat("<a href='Default.aspx?page={0}'>{0}</a>", pageCount); 

    075  

    076                sb.AppendFormat("<a href='Default.aspx?page={0}'>下一页</a>", pageIndex + 1); 

    077  

    078            } 

    079        } 

    080        else  //导航中不出现省略号 

    081        { 

    082            from = 1; to = pageCount; 

    083  

    084            if (pageIndex != 1) 

    085                sb.AppendFormat("<a href='Default.aspx?page={0}'>上一页</a>", pageIndex - 1); 

    086  

    087            sb.Append(ShowPageNavigation(pageIndex, from, to)); 

    088  

    089            if (pageIndex != pageCount) 

    090                sb.AppendFormat("<a href='Default.aspx?page={0}'>下一页</a>", pageIndex + 1); 

    091        } 

    092  

    093        return sb.ToString(); 

    094    } 

    095  

    096    private static string ShowPageNavigation(int pageIndex, int from, int to) 

    097    { 

    098        StringBuilder sb = new StringBuilder(); 

    099  

    100        for (int i = from; i <= to; i++) 

    101        { 

    102            if (i == pageIndex) 

    103            { 

    104                sb.AppendFormat("<span class='current'>{0}</span>", i); 

    105            } 

    106            else

    107            { 

    108                sb.AppendFormat("<a href='Default.aspx?page={0}'>{0}</a>", i); 

    109            } 

    110        } 

    111  

    112        return sb.ToString(); 

    113    } 

    114}