C# 生成仿京东页码条，服务器端实现

来源：互联网发布：精准的日语翻译软件编辑：程序博客网时间：2024/05/29 18:43

最终运行效果图如下：

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

namespace Common
{
/// <summary>
/// 分页工具类
/// </summary>
public class PageUtils
{
/// <summary>
/// 初始化pageutils
/// </summary>
/// <param name="pageindex">当前页</param>
/// <param name="total">总页数</param>
/// <param name="pagesize">页容量</param>
/// <param name="url">生成的url</param>
public PageUtils(int pageindex, int total, int pagesize, string url)
{
if (pageindex <= 0)
{
this.pageindex = 1;
}
else
{
this.pageindex = pageindex;
}
if (this.pageindex > total)
this.pageindex = total;
this.Total = total;
this.PageSize = pagesize;
this.url = url;
}

private string placeholder = "...";
/// <summary>
/// 空白页点位符
/// </summary>
public string Placeholder
{
get { return placeholder; }
set { placeholder = value; }
}
public PageUtils()
{
// TODO: Complete member initialization
}
/// <summary>
/// 生成超链接的网址
/// </summary>
public string url { get; set; }
private StringBuilder HtmlPage = new StringBuilder();

/// <summary>
/// 增加一个页码
/// </summary>
/// <param name="pagenum">页码</param>
private void AddOnePagenum(int pagenum)
{

if (this.pageindex == pagenum)
{
//ToDo:这里要处理样式
this.HtmlPage.AppendFormat("<a class='curr'>");
}
else
{
this.HtmlPage.AppendFormat("<a href='{0}?pagesize={1}&pageindex={2}'>", url, PageSize, pagenum);
}
this.HtmlPage.Append(pagenum);
this.HtmlPage.Append("</a>");
}
public void AddPageToal()
{
this.HtmlPage.Append("<span class='p-skip'>");
this.HtmlPage.AppendFormat("<em>共<b>{0}</b>页  到第</em>", Total);
this.HtmlPage.Append("<input class=\"input-txt\" id=\"page_jump_num\" maxlength=\"4\" value=\"" + pageindex + "\" onkeyup=\"this.value=this.value.replace(/[^0-9]/g,'');\" onkeydown=\"javascript:if(event.keyCode==13){page_jump();return false;}\">");
this.HtmlPage.AppendFormat("<em>页</em>");
this.HtmlPage.AppendFormat("<a href=\"javascript:page_jump();\" class=\"btn btn-default\">确定</a>");
this.HtmlPage.Append("</span>");
}
/// <summary>
/// 增加前一页按钮
/// </summary>
private void AddPreBtn(int pagenum)
{
//<a href='/ashx/test.aspx?pagesize=10&pageindex=1'>"
if (pagenum <= 0)
{
this.HtmlPage.AppendFormat("<a class='pn-prev disabled' >");
}
else
{
this.HtmlPage.AppendFormat("<a href='{0}?pagesize={1}&pageindex={2}'>", url, PageSize, pagenum);
}
this.HtmlPage.Append("<i><</i><em>上一页</em>");
this.HtmlPage.Append("</a>");
}

/// <summary>
/// 增加下一页
/// </summary>
/// <param name="pagenum"></param>
private void AddNextBtn(int pagenum)
{
this.HtmlPage.AppendFormat("<a href='{0}?pagesize={1}&pageindex={2}' class=\"pn-next\">", url, PageSize, pagenum);
this.HtmlPage.Append("下一页<i>></i>");
this.HtmlPage.Append("</a>");
}

/// <summary>
/// 增加空白按钮
/// </summary>
private void AddPlaceholderBtn()
{
this.HtmlPage.Append("<b class='pn-break'>");
this.HtmlPage.Append(placeholder);
this.HtmlPage.Append("</b>");
}
/// <summary>
/// 增加当前页按钮
/// </summary>
private void AddCurrentPageIndex(int pagenum)
{
this.HtmlPage.AppendFormat("<a class='curr'>");
this.HtmlPage.Append(pagenum);
this.HtmlPage.Append("</a>");
}
private int pageindex = 1;
/// <summary>
/// 当前页
/// </summary>
public int PageIndex
{
get
{
if (pageindex <= 0)
pageindex = 1;
return pageindex;
}
set
{
pageindex = value;
}
}
/// <summary>
/// 总页数
/// </summary>
public int Total { get; set; }

private int groupsize = 6;
/// <summary>
/// 组页码数
/// </summary>
public int GroupSize
{
get
{

return groupsize <= 6 ? 6 : groupsize;
}
set
{
groupsize = value;
}
}

private int forwardshowcount = 3;
/// <summary>
/// 页码前面显示页码个数
/// </summary>
public int ForwardShowCount
{

get { return forwardshowcount < 3 ? 3 : forwardshowcount; }

set { forwardshowcount = value; }
}

private int backwardshowcount = 2;
/// <summary>
/// 页码后显示页码个数
/// </summary>
public int BackwardshowCount
{

get { return backwardshowcount < 2 ? 2 : backwardshowcount; }
set { backwardshowcount = value; }
}
/// <summary>
/// 当前输出页码
/// </summary>
private int offsetindex = 0;
private int lastindex = 0;

public int PageSize { get; set; }

/// <summary>
/// 生成页码条
/// </summary>
/// <returns></returns>
public String GeneratePageNumbers()
{
this.HtmlPage.Append("<div class=\"page clearfix\">");
this.HtmlPage.Append("<div id='J_bottomPage' class='p-warp'>");
this.HtmlPage.Append("<span class='p-num'>");
if (pageindex <= 0)
pageindex = 1;
if (pageindex > Total)
{
pageindex = Total;
}
//1.0总页数<组页数
if (Total <= groupsize && Total > 0)
{
//1.1如果总页数等于1 直接返回
if (Total == 1)
{
return HtmlPage.ToString();
}
//1.2如果总页数大于1
if (Total > 1)
{
//1.2.1生成上一页按钮
AddPreBtn(pageindex - 1);
}
offsetindex = 1;
//第一个页码--最后一个页码的生成
for (int i = 0; i < Total; i++)
{
AddOnePagenum(offsetindex);
offsetindex++;
}
//1.7增加下一页
if (pageindex < Total)
{
AddNextBtn(pageindex + 1);
}
}
else //大于分组
{
//2.1生成上页
if (pageindex > 1)
{
AddPreBtn(pageindex - 1);
}
else
{
AddPreBtn(-1);
}
//2.2添加第一页
offsetindex = 1;
AddOnePagenum(offsetindex);
offsetindex++;
//2.3判断需要加前.占位按钮吗
if (pageindex - forwardshowcount <= 2)
{
//添加当前页--pageindex的页码
int count = pageindex - offsetindex;
for (int i = 0; i < count; i++)
{
AddOnePagenum(offsetindex);
offsetindex++;
}
}
else
{
//添加点位符
AddPlaceholderBtn();
offsetindex = pageindex - forwardshowcount;
for (int i = 0; i < forwardshowcount; i++)
{
AddOnePagenum(offsetindex);
offsetindex++;
}
}
//2.4添加当前页
if (pageindex > 1)
{
AddCurrentPageIndex(pageindex);
}
offsetindex = pageindex + 1;
//2.5增加当前页后两页
for (int i = 0; i < backwardshowcount; i++)
{
if (offsetindex < Total)
{
AddOnePagenum(offsetindex);
offsetindex++;

}
}
//当前页小于总页码时添加
if (pageindex < Total)
{
if (Total - pageindex > backwardshowcount + 1)
{
//2.6增加空白占位按钮
AddPlaceholderBtn();
}
//增加最后一页
AddOnePagenum(Total);
//2.7增加下一页
AddNextBtn(pageindex + 1);
}

}
this.HtmlPage.Append("</span>");
AddPageToal();

this.HtmlPage.Append("</div>");
this.HtmlPage.Append("</div>");
return this.HtmlPage.ToString();
}
}
}

/*css代码*/

body {

font: 12px/150% Arial,Verdana,"\5b8b\4f53";
color: #666;
}
div, a, u, span, em, b, p, i {
margin: 0;
padding: 0;
}
em, i, u {font-style: normal;}
.page .p-num {float: left;}
a {text-decoration: none;}
.page {margin-bottom: 10px;}
.page .p-num a {
color: #333;
border: 1px solid #ddd;
}
.page .p-wrap {
float: right;
}
.page .p-skip em {
float: left;
line-height: 38px;
font-size: 14px;
}
.page .p-num a {
color: #333;
border: 1px solid #ddd;
background-color: #f7f7f7;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(top,#f7f7f7,#f2f2f2);
background-image: -webkit-linear-gradient(top,#f7f7f7,#f2f2f2);
background-image: -o-linear-gradient(top,#f7f7f7,#f2f2f2);
background-image: linear-gradient(top,#f7f7f7,#f2f2f2);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f7f7', endColorstr='#f2f2f2', GradientType=0);
}
.page .p-num a, .page .p-num b {
float: left;
height: 36px;
line-height: 36px;
padding: 0 14px;
margin-right: 5px;
font-size: 14px;
}
.page .p-num .pn-next i, .page .p-num .pn-prev i {
vertical-align: middle;
font-style: normal;
font-size: 16px;
font-family: "\5b8b\4f53";
padding: 0 5px;
color: #aaa;
}
.page .p-num .pn-next.disabled, .page .p-num .pn-prev.disabled {
background: #fff;
cursor: default;
}
.page .p-skip {
float: left;
margin-left: 20px;
}
.page .p-skip .input-txt {
float: left;
width: 30px;
height: 30px;
margin: 0 3px;
line-height: 30px;
font-size: 14px;
text-align: center;
}
.input-txt {
height: 17px;
line-height: 17px;
border: 1px solid #CCC;
padding: 3px;
width: 145px;
}
.page .p-num a:hover {
text-decoration: none;
box-shadow: 0 1px 1px rgba(0,1,1,.08);
}
.page .p-num .pn-next em, .page .p-num .pn-prev em {
vertical-align: middle;
}
.page .p-num a, .page .p-num b {
float: left;
height: 36px;
line-height: 36px;
padding: 0 14px;
margin-right: 5px;
font-size: 14px;
}
.page .p-num a.curr {
border: 0 none;
padding: 1px 15px;
background: 0 0;
filter: none;
color: #e4393c;
cursor: default;
}
.page .p-num .pn-prev i {
padding-left: 0;
}
.page .p-skip .btn {
float: left;
height: 27px;
margin-left: 10px;
font-size: 14px;
line-height: 27px;
}
.btn-default {
display: inline-block;
line-height: 14px;
height: 14px;
border-radius: 2px;
background: #F7F7F7;
text-align: center;
text-decoration: none;
cursor: pointer;
border: 1px solid #DDD;
padding: 4px 13px 5px;
color: #666;
background-color: #f7f7f7;
background-repeat: repeat-x;
background-image: -moz-linear-gradient(top,#f7f7f7,#f2f2f2);
background-image: -webkit-linear-gradient(top,#f7f7f7,#f2f2f2);
background-image: -o-linear-gradient(top,#f7f7f7,#f2f2f2);
background-image: linear-gradient(top,#f7f7f7,#f2f2f2);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f7f7f7', endColorstr='#f2f2f2', GradientType=0);
}

//页面

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="test.aspx.cs" Inherits="MvcHouse.Ashx.test" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="css/jdpagenum.css" media="all"/>
<script type="text/javascript">

function page_jump() {
var pageindex = document.getElementById("page_jump_num").value;
window.location = "/ashx/test.aspx?pageindex=" + pageindex;
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<%

Response.Write(pageutils.GeneratePageNumbers());
%>
</div>
</form>
</body>
</html>

//cs文件

using Common;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace MvcHouse.Ashx
{
public partial class test : System.Web.UI.Page
{
public Common.PageUtils pageutils = new PageUtils();
protected void Page_Load(object sender, EventArgs e)
{
pageutils.PageIndex = Request.QueryString["pageindex"] == null ? 1 : int.Parse(Request.QueryString["pageindex"]);
pageutils.Total = Request.QueryString["Total"] == null ? 8 : int.Parse(Request.QueryString["Total"]);
pageutils.url = "/ashx/test.aspx";

}
}
}

0 0