jq实现分页,jquery实现分页

　　点击一个字母后，以该字母为首字母的所有单词都显示在下面；

　　分页，每页显示15个字，每组有20个页码，1-20/20-40 ~ ~ ~

　　首先是PHP文件中分页分页器的相关代码。

　　公共函数searchWordsByInitial()

　　//从AJAX发送的URL中获取参数：用户点击的字母和点击的页码。

　　$ initial=html entities($ _ POST[ initial ]，ENT_QUOTES， UTF-8 )；

　　$ page=html entities($ _ POST[ page ]，ENT_QUOTES， UTF-8 )；

　　$ words=$ this-_ createWordObj()；

　　$ I=0；//用于显示序号从1开始

　　$ perPageNum=12//每页显示的文章数为12。

　　$ current page first=($ page-1)* $ perPageNum 1；

　　$ current page last=$ page * $ perPageNum；

　　//获取记录总数

　　$ sum num=0；

　　foreach($ words[$ initial]as $ key=$ word){

　　$ sumNum

　　//获取总页数

　　$ pageNums=0；

　　if(sum num){

　　if($ sumNum $ perPageNum){ $ pagenum=1；}//如果数据总量小于$PageSize，那么只有一页

　　If( $sumNum%$perPageNum ){ //取数据总量除以每页的余数。

　　$ pagenum=(int)($ sumNum/$ perPageNum)1；//如果有余数，则页数等于数据总量除以每个页数，结果四舍五入加1。

　　}否则{

　　$ pagenum=$ sumNum/$ perPageNum；//如果没有余数，则页数等于数据总量除以每页。

　　否则{

　　$ pageNums=0；

　　公共函数init _ search wordsbyinitial _ Pager($ sumNum，$pageNums，$page)

　　//根据用户点击的页码，得到当前页面组的首页代码，比如用户点击的是38，那么这个组是21-40，首页代码是21。

　　$ current _ first _ page=floor(($ page-1)/20)* 20 1；

　　$ tab _ str= div id= search wordsbyinitial _ Pager ul

　　for($ k=0；$k $k)

　　$ j=$ k $ current _ first _ page

　　$tab_str。=按钮。$ j . /按钮

　　$tab_str。= /ul有span id= sumnums 。$ sumnum。/span words，span id= pagenum 。$ pagenum。/span page /div。

　　返回$ tab _ str

　　}

　　Init.js相关的JQuery代码，它响应用户的操作。

　　//初始化寻呼寻呼机

　　var pageNums//总页数

　　var sumNums//记录总数

　　函数init _ search wordsbyinitial _ Pager(){

　　pageNums=$(#pageNums )。html()；//JS从页面HTML中获取

　　sumNums=$(#sumNums )。html()；

　　if(pagenum==1)//如果只有一页，则隐藏页导航。

　　$(#searchWordsByInitial_Pager )。html( /br

　　//设页码默认值为1，默认显示第一页；

　　if(page _ initial==undefined){ page _ initial=1；}

　　//页面太多的时候，我们一组只显示20个页码，后面跟着一个NEXT按钮。点击后，我们可以显示以下20个页码；同样，最后一个按钮可以显示前20个按钮。

　　$( # search wordsbyinitial _ Pager ul button:eq(19))。之后( button id= more _ forward Next/button

　　$( # search wordsbyinitial _ Pager ul button:eq(0))。之前( button id= more _ back word Last/button

　　//如果最后一组少于21页，则隐藏最后一个页码后的一组，包括下一步按钮[pageNums 21]

　　//如果用户点击的页面是最后20页，那么最后一个页码之后的页面也要隐藏，包括NEXT按钮[offset 20]

　　//(因为点击页面会触发这个初始化函数/其实你可以只把初始化函数的调用绑定到click letter事件上，不需要和Ajax动作绑定)

　　//如果当前组的第一页为1，则隐藏最后一个按钮；否则，将显示最后一个按钮，允许用户单击以转到上一组。

　　if($( # search wordsbyinitial _ Pager ul button . not _ more _ BTN )。等式(0)。html()==1)

　　$( # search wordsbyinitial _ Pager ul button:eq(0))。hide()；

　　其他

　　$( # search wordsbyinitial _ Pager ul button:eq(0))。show()；

　　//单击下一步按钮

　　$(#more_forward )。实况(点击，功能(事件){

　　//只要有翻页，就会有最后一个按钮

　　$( # search wordsbyinitial _ Pager ul button:eq(0))。show()；

　　//让每页加20，比如1-20到21-40。

　　for(I=0；i i ){

　　$( # search wordsbyinitial _ Pager ul button . not _ more _ BTN )。等式(一)。html(parse int($( # search wordsbyinitial _ Pager ul button . not _ more _ BTN )。等式(一)。html())20)；

　　//在最后一页页码后隐藏按钮

　　if($( # search wordsbyinitial _ Pager ul button . not _ more _ BTN )。等式(一)。html()==pageNums)

　　$( # search wordsbyinitial _ Pager ul button )。切片(i 2)。hide()；

　　for(I=0；i i ){

　　$( # search words by initial _ Pager ul按钮。不是更多的BTN).等式（一)。html(parse int($( # search words by initial _ Pager ul button。不是更多的BTN).等式（一)。html())-20)；

　　//判断是否要隐藏最后的按钮

　　if($( # search words by initial _ Pager ul button。不是更多的BTN).等式(0)。html()==1)

　　$( # search words by initial _ Pager ul button:eq(0)).hide()；

　　其他

　　$( # search words by initial _ Pager ul button:eq(0)).show()；

　　$(.初始按钮列表按钮)。实况(点击，功能（事件){

　　//清除所有字母笔划索引按钮的活跃类，并且设置点击的字母按钮为活跃；这里不要使用。属性和removeAttr

　　$(.初始按钮列表按钮)。移除类(“active”)；

　　$(这个)。添加类(“活动”)；

　　//将要传送的参数拼串action=list _ by _ initial initial=O page _ initial=3

　　BTN data= action=list _ by _ initial initial= initial _ value page= page _ initial；

　　$.ajax({