今天我们要用创建交互式、快速动态网页应用的网页开发技术做一个分页：

实现埃阿斯分页：

如果可以的话加上查询条件

找一张表做分页分页不使用页，面，张，版类页面不用刷新埃阿斯加载数据！doctype html html lang=' en ' head meta charset=' UTF-8 '/title document/title script src=' http : jquery-1。11 .2 .量滴js '/脚本样式类型=' text/CSS ' .当钱{底色： # 69F }/风格/头像dydiv输入类型='text' id='key' /输入类型='按钮'值='查询id=' cha Xun '/div表格宽度=' 50% '边框=' 1 '边框colordark=' 0 '边框colorlight=' 0 ' tr TD代号运输署/运输署名称运输署/运输署父级代号/td /tr tbody id='neirong '！-显示内容-/t body/table div id=' fenyexinxi '/div/body脚本类型=' text/JavaScript ' var page=1；//定个变量，当前要显示的页load()；//加载数据loadfenyexinxi()；//加载分页信息//查询$('#chaxun ').click(function(){ page=1；load()；//加载数据loadfenyexinxi()；//加载分页信息})函数Load() { var key=$('#key ').val()；//查询条件。用户输入的内容$.ajax({ url:'chuli.php '，data: { page: page，key: key }，//传2个参数一当前页2关键字也就是查询条件类型： '开机自检'，数据类型：'JSON '，成功：函数（数据){//匿名函数var str=//这个将来要放表格显示的用于(数据中的var k)//通过K可以获得每一条数据{//加载数据完成str='trtd '数据k .区号'/tdtd '数据k .区域名称/' tdtd '数据k .parentarecode '/TD/tr '；//要显示的内容，代号、名称父级代号} $('#neirong ').html(字符串);} });}函数Loadfenyexinxi()//分页信息{ var str=var min ys=1；//最小页数var maxys=1；//最大页数var key=$('#key ').val()；//取关键字用于传到zys页面用$.ajax({ async:false，type:'POST '，url:'fenye.php '，data:{key:key}，dataType:'TEXT '，success :函数(d){ maxys=d；} });str=' span style=' text-decoration :下划线；'光标：指针'总共：“maxys”页/span '；str=' span id=' prev ' style=' text-decoration :下划线；'光标：指针'上一页/span '；对于(var I=第2页；知识产权时代3；I){ if(I=minys I=maxys){ if(I==page){ str=' span style=' text-decoration :下划线；光标：指针' class=' danqian ' bs=' I ' ' ' I '/span '；} else { str=' span style=' text-decoration :下划线；光标：指针' class=' list ' bs=' I ' ' ' I '/span '；} } } str=' span style=' text-decoration :下划线；光标：指针指针id='next '下一页/span '；$('#fenyexinxi ').html(字符串);$('#prev ').点击(function(){ page=page-1；if(第1页){ page=1；} Load()；loadfenyexinxi()；}) $('#next ').点击(function(){ page=page 1；if(page maxys){ page=maxys；} Load()；loadfenyexinxi()；}) $('.列表')。单击(function(){ page=Parseint($(this)).attr(' bs ')；load()；loadfenyexinxi()；})}/脚本/html上面是这页面：test.php

？DBDA。上课。PHP’)；$db=新DBDA()；//把上个页面的2个值传过来$ page=$ _ POST[' page ']；//当前页$ key=$ _ POST[' key ']；//条件，关键字$ num=20/定义，一页里多少条数据，$跳数=($ page-1)* $ num；//$跳书跳过多少条($page-1)*$num现在$num是20条//写$SQL语句$sql='从中国选择*，其中areaname如“%{$key}%”限制为{ $调数}，{ $ num } '；//根据关键字查比如"% { $调剑}%".echo $ db-JSonquery($ SQL)；上面是处理页面：chuli.php:

？DBDA。上课。PHP’)；$db=新DBDA()；$ key=$ _ POST[' key ']；$ num=20$sql='从区域名为“%{$key}%”的中国各州中选择计数(*)；$ zts=$ db-Strquery($ SQL)；echo ceil($ zts/$ num)；上面是分页页面：fenye.php

下面就是我们的显示效果：

当您单击“下一步”时，下面将显示五个页面，当前页面的左侧和右侧有两个页面。每页显示的信息数量可以自行调整。

在上方文本框中输入关键词将显示相关信息。这就是我们用ajax做的。

以上是边肖介绍的不刷新分页的Ajax实现的示例代码。希望对大家有帮助。如果你有任何问题，请给我留言，边肖会及时回复你。非常感谢您对我们网站的支持！