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({
类型： POST ，
网址：进程文件，
数据：btnData，
成功：函数（数据){
$(#word_table_by_initials ).show()；
$(#word_table_by_initials ).html(" ")；
$(#word_table_by_initials ).html(数据);
init _ search wordsbyinitial _ Pager()；
错误：函数（消息)
警报（消息);
//获取用户点击的页码（除去点击更多按钮)
$( # search words by initial _ Pager button。不是更多的BTN).实况(点击，功能（事件){
//清除所有页码的活跃类，并且设置点击的页码为活跃；这里不要使用。属性和removeAttr
$( # search words by initial _ Pager button ).移除类(“active”)；
$(这个)。添加类(“活动”)；
//获取当前点击的页码
page_initial=$(这个)。html()；
//将要传送的参数拼串action=list _ by _ initial initial=O page _ initial=3
BTN data= action=list _ by _ initial initial= initial _ value page= page _ initial；
$.ajax({
类型： POST ，
网址：进程文件，
数据：btnData，
成功：函数（数据){
$(#word_list_by_initials ).hide()；
$(#word_table_by_initials ).html(" ")；
$(#word_table_by_initials ).html(数据);
init _ search wordsbyinitial _ Pager()；
错误：函数（消息)
警报（消息);
});
一些注意事项：
1，$(divbutton.not_more_bt )中，前两个选择器之间是有空格的，后两个没有；因为最后一个是类选择器，要直接跟在按钮后面
2,html().val().文本()的区别
3，eq(index)，lt(index)；索引中的指数是从0开始，而且不能为变量，必须为数字
如果需要让用到动态的索引，可以用。等式（一)
4、var a=20
var b=10
var c；
c=a b；
结果不是30!是2020!
正确的写法是c=parse int(a)_ parse int(b)；
减法没事，但是最好也要转化一下
服务器端编程语言(专业超文本预处理器的缩写)的函数是intval()；
5,写代码之前，一定要规划好最优的方案，否则重头来就更费事了
6、JS代码和超文本标记语言加载的逻辑顺序
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。