HTML
在页面中，#列表是用来显示数据列表，包括要在这个例子中显示的图片和货物的所有权，并#总页数是用来显示分页栏，就是在这种情况下。
当然，不要忘记将jQuery库文件预加载到头部。
CSS
我们需要安排商品的图片和设置分页样式。当然，这些样式的设计可以根据成功阅读后的数据来设定。在这种情况下，我们首先将CSS代码粘贴出去。
#列表{宽度：680px；身高：530px；保证金：2px汽车；位置：相对}
#列表ul {浮动：左；宽度：220px；身高：260px；保证金：2px }
#列表UL Li img {宽度：220px；身高：220px }
#列表UL Li P {线高度：22px }
# pagecount {宽度：500px；保证金：10px汽车；文本对齐：中心}
# pagecount跨度{保证金：4px；字体大小：14px }
#列表ul #加载{宽度：120px；身高：32px；边框1px solid # d3d3d3；
位置：绝对；顶：35%；左：42%；文本对齐：中心；背景：# f7f7f7
URL（加载GIF）没有重复8px 8px；-moz盒阴影：1px 1px 2px RGBA（0,0,0，。2）；
Webkit框阴影：1px 1px 2px RGBA（0,0,0，。2）；箱的影子：1px 1px 2px RGBA（0,0,0，2）；}
jQuery
我们首先声明变量，下面的代码使用以下变量。
无功curpage = 1； / /当前页号
无功总、大小totalpage； / /总记录数，每个页面显示的页面总数。
接下来，我们定义一个函数：GetData（），这是用来获取当前页的数据。在函数中，我们使用$（）。Ajax发送异步请求到后台后pages.php通过JSON格式的当前页码的背景。
/ /获取数据
函数GetData（页）{
$ ajax（{
类型：'post，
网址：'pages PHP的，
数据：{ 'pagenum：page-1 }，
DataType：'json，
beforesend：函数（）{
$（#列表ul）。追加（加载中…）； / /显示加载动画
}，
成功：函数（JSON）{
$（#列表ul）（空）； / /空的数据区
总= json.total； / /总记录数
PageSize = json.pagesize； / /页码
curpage =页； / /当前页
totalpage = json.totalpage； / /总页数
Var Li =；
var list = json.list；
每个（列表，函数（索引，数组）），遍历数据列
李=+阵{标题}
；
}）；
$（#列表ul）。追加（李）；
}，
（完整的：函数）生成一个页面
getpagebar（）；
}，
错误：函数（）{
警报（数据加载失败）；
}
}）；
}
在请求成功，返回的数据，相应的数据附加到变量和返回的商品数据表运行到相应的容器#列表ul。当数据被完全加载，分页栏功能getpagebar（）调用生成分页栏。
获取/带
功能getpagebar（）{
页码大于页面的最大页数。
如果（curpage > totalpage）curpage = totalpage；
页码小于1
如果（curpage＜1）curpage = 1；
pagestr =普通+总+酒吧+ curpage
+ / totalpage + +；
如果这是第一页
如果（curpage = = 1）{
pagestr =主页；
其他{ }
pagestr =主页
；
}
如果它是最后一页
如果（curpage > = totalpage）{
pagestr = ；
其他{ }
= pagestr
尾页
；
}
$（#总页数）。Html（pagestr）；
}
最后，当页面加载时的第一时间，我们的负载是第一页数据，GetData（1）。当点击页面链接在分页栏，我们调用GetData（页面）加载数据对应的页码。我们通过getpagebar预埋在页面的连接性能相对数页号（）函数。
$（函数（）{（））
GetData（1）；
$（# pagecount跨度）。活（听到咔哒声，函数（））{
VaR rel=美元（这）。Attr（关系）；
如果（相对）{
GetData（REL）；
}
}）；
}）；
PHP
Pages.php收到的每个头版Ajax请求。根据提交的页面pagenum值，得出的数据从MySQL数据库，计算记录和总页数总数，读取对应的页码在数据列表，并返回的JSON格式的头版的最终结果。
include_once（'connect。php）； / /连接数据库，跳过，具体请下载源代码视图
页= intval美元（美元_post { 'pagenum}）； / /当前页
结果= mysql_query美元（选择ID从食品）；
总美元= mysql_num_rows（$结果）； / /总记录数
$ PageSize = 6； / /页码
totalpage美元=细胞（$总 / / $ PageSize）；/总页数
起始页*美元美元美元= PageSize； / /记录
数组结构
{ } =综合的ARR美元美元总；
'pagesize} = { $ ARR为美元；
'totalpage} = { $ ARR totalpage美元；
为查询= mysql_query（选择ID、标题、照片ID ASC菜）
美元美元的起始，为）； / /查询分页数据
而（$行= mysql_fetch_array（$查询））{
美元的} { } { 'list arr数组（=
ID = > $行{ 'id' }，
标题= > $行{标题}，
PIC= > $行{ 'pic}，
）；
}
回声json_encode（$ ARR）； / / JSON输出数据
然后回到首页，就是看到数据已子页面，点击查看如果你想看到的演示效果的分页样式，您可以自定义，我给你最基本的风格。
最后，附加到MySQL表结构，下载数据包的数据包，哦，为你准备好了。
如果不存在，创建表（食物）
` ID ` int（11）不为空auto_increment，
`标题` varchar（100）不为空，
` PIC ` varchar（255）不为空，
主键（id）
= MyISAM引擎默认的字符集utf8）；
以上所述的是关于mysql实现分页显示数据的实例，ajax的分页效果使您的网站数据加载非常顺利，希望本文对大家的学习有所帮助。
