Maison > interface Web > js tutoriel > le corps du texte

JQuery+Ajax无刷新分页的实例代码_jquery

WBOY
Libérer: 2016-05-16 17:01:07
original
954 Les gens l'ont consulté

先看效果图:

实现原理很简单,使用了jquery.pagination这个插件,每当点击页码时异步去服务器去取该页的数据,简单介绍如下:
一、数据库表结构:很简单  就四个字段 分别是News_id  News_title  News_time  News_readtimes

二、前台页面代码:

复制代码 代码如下:


    JQuery无刷新分页
   
   
   
   
   


复制代码 代码如下:


   

       
           
               
               
               
               
           
       

                    ID
               

                    标题
               

                    更新时间
               

                    点击量
               

       
   

   


三、页面后台文件

这里主要是获取记录总数:

复制代码 代码如下:

public string pageCount = string.Empty;//总条目数

        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                pageCount = new News().GetNewsCount();
            }
        }


四、最主要的是ajax处理程序:PagerHandler.ashx
复制代码 代码如下:

 public class PagerHandler : IHttpHandler
    {
        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            string str = string.Empty;
            int pageIndex = Convert.ToInt32(context.Request["pageIndex"]);
            int size = Convert.ToInt32(context.Request["pageSize"]);
            if (pageIndex == 0)
            {
                pageIndex = 1;
            }
            int count = 0;

            News n = new News();
            List list = n.GetNewsList(pageIndex, size, ref count);
            StringBuilder sb = new StringBuilder();
            foreach (News p in list)
            {
                sb.Append(" ");
                sb.Append(p.News_id);
                sb.Append(" ");
                sb.Append(""+p.News_title+"");
                sb.Append(" ");
                sb.Append(p.News_time);
                sb.Append(" ");
                sb.Append(p.News_readtimes);
                sb.Append(" ");
            }
            str = sb.ToString();
            context.Response.Write(str);
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal