无刷新分页 jquery.pagination.js

最新推荐文章于 2025-06-28 10:48:29 发布

porschev

最新推荐文章于 2025-06-28 10:48:29 发布

阅读量3.9w

点赞数 1

CC 4.0 BY-SA版权

分类专栏： Jquery 文章标签： stylesheet function class xhtml callback string

本文链接：https://blog.csdn.net/porschev/article/details/6114997

Jquery 专栏收录该内容

3 篇文章

订阅专栏

本文介绍使用JQuery插件实现网页无刷新分页的方法，包括前端页面展示、后端数据处理及AJAX异步加载等关键技术。通过具体实例演示了如何配置分页插件参数并实现动态更新数据。

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

采用Jquery无刷新分页插件jquery.pagination.js 实现无刷新分页效果

1.插件参数列表

参数列表

http://www.dtan.so

2.页面内容：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Porschev----无刷新翻页</title> <mce:script src="Script/jquery-1.4.1.min.js" mce_src="Script/jquery-1.4.1.min.js" type="text/javascript"></mce:script> <mce:script src="Script/jquery.pagination.js" mce_src="Script/jquery.pagination.js" type="text/javascript"></mce:script> <mce:script src="Script/tablecloth.js" mce_src="Script/tablecloth.js" type="text/javascript"></mce:script> <link href="Style/tablecloth.css" mce_href="Style/tablecloth.css" rel="stylesheet" type="text/css" /> <link href="Style/pagination.css" mce_href="Style/pagination.css" rel="stylesheet" type="text/css" /> <mce:script type="text/javascript"></mce:script> </head> <body> <div align="center"> <h1>Posrchev----无刷新分页</h1> </div> <div id="container"> <table id="Result" cellspacing="0" cellpadding="0"> <tr> <th>编号</th> <th>名称</th> </tr> </table> <div id="Pagination"></div> </div> </body> </html>

3.页面后台内容：

using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; public partial class _Default : System.Web.UI.Page { public string pageCount = string.Empty; //总条目数 protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { pageCount = new PagerTestBLL.PersonManager().GetPersonCount().ToString(); } } }

4.Handler中的内容：

<%@ WebHandler Language="C#" Class="PagerHandler" %> using System; using System.Web; using System.Collections.Generic; using System.Text; public class PagerHandler : IHttpHandler { public void ProcessRequest (HttpContext context) { context.Response.ContentType = "text/plain"; string str = string.Empty; //具体的页面数 int pageIndex; int.TryParse(context.Request["pageIndex"], out pageIndex); //页面显示条数 int size = Convert.ToInt32(context.Request["pageSize"]); if (pageIndex == 0) { pageIndex = 1; } int count; List<PagerTestModels.Person> list = new PagerTestBLL.PersonManager().GetAllPerson(size, pageIndex, "", out count); StringBuilder sb = new StringBuilder(); foreach (PagerTestModels.Person p in list) { sb.Append("<tr><td>"); sb.Append(p.Id.ToString()); sb.Append("</td><td>"); sb.Append(p.Name); sb.Append("</td></tr>"); } str = sb.ToString(); context.Response.Write(str); } public bool IsReusable { get { return false; } } }

5.实现效果图：

实现效果图