DDR爱好者之家 Design By 杰米
我觉得还是有必要把我的ajax分页呈现给大家．我先讲一下这个ajax分页的实现核心，然后我们再看实例效果．所谓的ajax分页与传统的数据分页，在服务端的代码基本上是一样的．我们主要做的是使用ajax在不刷新的情况下，将请求的页码，和每页要显示的条数发送给服务端的处理网页．大家点击这个网址就可以看到要请求的数据："ajax_page.asp?action=read&pagecount=3 & current_page=1"
在这段URL里，pagecount代表每页要显示几条数据，current_page代表要请求的页码．服务端就是根据这两个参数来传回你想要请求的数据．下面我们看下实例效果：
这是前端的ajax代码：
复制代码 代码如下:
<html>
<head>
<title>ajax数据分页</title>
<style>
body{
font-size:12px;
}
table{
border-collapse:collapse;
}
li{
list-style:none;
border:1px solid;
width:20px;
height:20px;
text-align:center;
margin:5px;
padding:2px;
float:left;
cursor:pointer;
}
</style>
</head>
<body>
默认显示每页为5条数据，你可以在下面文本框设置每页的显示条数<hr/>
输入每页要显示的条数:<input id="edit_count" type="text" /> <input type="button" type="button" value="确定" onclick="Read()"/>
<table border="1"><!--该表格用来显示数据内容-->
<thead><tr><td>编号</td><td>内容</td></tr></thead>
<tbody id="a"></tbody>
</table>
<span id="msg" style="color:red"></span>
<br/>
<ul id="page"><!--页导航-->
</ul>
<script type="text/javascript">
var All_page;//总页数
var All_record;//总条数
var Current_page;//当前页
var PageCount;//每页显示的条数
function ajax_xmlhttp(){
//在IE中创建xmlhttpRequest,适用于IE5.0以上所有版本
var msXmlhttp = new Array("Msxml2.XMLHTTP.5.0","Msxml2.XMLHTTP.4.0","Msxml2.XMLHTTP.3.0","Msxml2.XMLHTTP","Microsoft.XMLHTTP");
for(var i=0; i<msXmlhttp.length; i++){
try
{
_xmlhttp=new ActiveXObject(msXmlhttp[i]);
}
catch(e)
{
_xmlhttp=null;
}
} //循环创建基于IE浏览器的xmlhttp.结束
//如果非IE浏览器，则创建基于FireFox等浏览器的xmlhttpRequest
if(!_xmlhttp && typeof XMLHttpRequest != "undefined")
{
_xmlhttp=new XMLHttpRequest();
}
return _xmlhttp;
}
//获取元素函数
function $(elem){
return typeof elem == "string" ? document.getElementById(elem) : elem;
}
//读取数据函数
function Read(){
if(arguments.length!=0){//如果有参数传递过来，则证明你点击了某个页码
var e = arguments[0] || window.event; //标准化事件对象
var obj = e.target || e.srcElement; //获取事件对象,你点击的那个页码元素
Current_page = parseInt(obj.innerHTML);//获取元素中的数字值，证明你要请求的是第几页
$("msg").innerHTML = "当前为第"+Current_page+"页";//提示信息：当前请求的页
}
PageCount = $("edit_count").value;//获取文本框的值
if(PageCount.length == 0){ //如果文本框为空
PageCount = 5; //默认每页显示5条数据
}
var ajax = ajax_xmlhttp(); //将xmlhttprequest对象赋值给一个变量．
ajax.open("post","ajax_page.asp?action=read&pagecount="+PageCount+"& current_page="+Current_page,true);//设置请求方式，请求的网页，url的action参数为read，异步请求
ajax.onreadystatechange = function(){//你也可以这里指定一个已经写好的函数名称
if(ajax.readyState == 4){//数据返回成功
if(ajax.status == 200){//http请求状态码返回ok
var xmlData = ajax.responseXML;//以xml格式接收返回的数据，并保存在xmlData变量里
All_Record = xmlData.getElementsByTagName("allrecord")[0].firstChild.nodeValue;
All_page = All_Record / PageCount;
var page_list = $("page");
while(page_list.childNodes.length!=0){
page_list.removeChild(page_list.childNodes[0]);
}
for(var i=0;i<Math.ceil(All_page);i++){ //动态创建页码列表
var li = document.createElement("li");
li.innerHTML = i+1;//因为i以0开始，所以要+1显示页码
li.onclick = function(e){Read(e)};//为每个li的页码绑定单击事件
page_list.appendChild(li);//将生成好的页码元素放到div里
}
var list = xmlData.getElementsByTagName("list");//在返回的数据里，获取所有list标签
if(list.length!=0){
var t = document.getElementById("a");//获取展示数据的表格
while(t.rows.length!=0){ //在读取数据时如果表格已存在行．一律删除
t.removeChild(t.rows[0]);
}
for(var i=0;i<list.length;i++){
var tr = t.insertRow(t.rows.length);//有几个list就为表格增加几行．
var td = tr.insertCell(0);//第一个单元格存放数据编号
td.innerHTML = list[i].childNodes[0].firstChild.nodeValue;
var td = tr.insertCell(1);//第二个单元格存放数据内容
td.innerHTML = list[i].childNodes[1].firstChild.nodeValue;
}
}
}
}
}
ajax.send(null);//提交请求，参数为null
}
Read();//运行Read函数
</script>
</body>
</html>
上面是本次ajax分页教程的前端代码，html部份我们就不讲了．直接开始script中的内容．首先我们定义了4个全局变量，分别是：
All_page：总页数，创建页码的根据
All_Record：数据总条数，All_Record/PageCount=All_page 得到总页数
Current_page：当前请求的页码．传送给服务端
PageCount：每页显示的条数，传送给服务端
然后依次是我写的3个自定义函数，分别为：
ajax_xmlhttp();该函数的作用是创建一个可用的XMLHTTPRequest对象，如果你还不知道什么是XMLHTTPRequest．请了解什么是XMLHTTPRequest
$(elem);获取元素的函数，根据页面中元素的id来对某个元素的引用，其实就是document.getElementById的缩写与引用，写成函数以后直接可以使用$("元素id")即可获取该元素．
Read()：读取数据的函数．也是我们的老朋友了，在前几篇的教程里都有使用．下面我们仔细来分析下，这一次我们在Read()函数里做了些什么．
(1)：if(arguments.length!=0)这是在判断在调用Read()函数时，是否有参数传递过来．如果有参数，则证明你点击了某个页码而触发了Read()．这时我们应该获取该页码，将页码数字赋值给Crrent_page变量．点击了解：arguments
(2)：var e = arguments[0] || window.event;标准化事件对象，arguments[0]是为了FF浏览器，window.event是IE浏览器
(3)：var obj = e.target || e.srcElement;标准了事件对象以后，我们要获取事件的源．也就是说是那个元素触发了Read()函数．此时的obj就是你点击的那个页码元素．
(4)：Current_page = parseInt(obj.innerHTML);获取元素中的数字值，证明你要请求的是第几页，在下面的请求中会把该值发送给服务端．
(5)：PageCount = $("edit_count").value;获取文本框里的值，如果你没有向文本框里输入值．那么每页默认显示5条数据．再声明一次，以前讲过的内容我们不再重复讲解．也就是说关于上面的代码我在该教程里没有解释到的．在以前的教程里会找到相关解释．
(6)：ajax.open("post","ajax_page.asp?action=read&pagecount="+PageCount+"& current_page="+Current_page,true);我们在请求的Url里将Pagecount与Current_page变量传递给了服务端，服务端接收到这两个变量以后会经过判断．如果PageCount为空那么将默认为5．如果Current_page为空则默认为第1页，然后会将相应的数据传回给客户端．
(7)：All_Record = xmlData.getElementsByTagName("allrecord")[0].firstChild.nodeValue;从服务端接收一个allrecord标签元素．该元素包含了一个数字值，该数字值是数据的总条数．
(8)：All_page = All_Record / PageCount;用总条数All_Record除以PageCount等于总页，得出有几页数据以后．我们会根据All_page来创建当前页码列表．
(9)：var page_list = $("page");获取存放页码列表的那个div元素．while(page_list.childNodes.length!=0)循环遍历该div内的子元素．将其子元素全部删除．每次根据当前页显示的条数不同，会生成不同的页码，所以必须删除上次请求生成的页码列表，当然你也可以改进我这种做法！如果你还不了解什么是子元素或如何删除子元素，请参阅：childNodes与removeChild
(10)：for(var i=0;i < Math.ceil(All_page);i++);使用一个for循环根据总页数来动态的生成页码列表，如果All_page为5，则生成5个页码．因为考虑到了会有余数．我使用了Math.ceil．如果你还不知道Math与ceil的作用，请参阅：Math与ceil
(11)：var li = document.createElement("li");创建一个li元素，并赋值给一个名字为li的变量．li.innerHTML= i+1;在li元素内写入页码数值．因为i是从0开始的，所有要加1．
(12)：li.onclick = function(e){Read(e)};为每个li元素绑定单击事件，这个是重点必须要理解清楚．我们向li绑定了Read(e)函数，并且利用e参数传递了事件对象．当你点击每个页码的时候会再次触发Read函数来读取数据．这个时候运行的Read(e)函数，是带有参数的．我们正是从参数内获得了你请求的页码，然后赋值给Current_page，利用url发送给了服务端．
你注意一下在script脚本部份里的最后一行：Read();此时Read()没有参数，并且只有当打开页面或刷新页面时才会执行这个Read()，此时的Read()向服务端发送的Current_page是空的．PageCount默认是5，这个时候服务端接收到空的页码，只会读取5条数据给你．与此同时我也从服务端接收了数据的总条数，利用总条数除以每页显示的条数．创建了页码．并且为每个页码绑定了 Read(e)函数．只有当你点击这些页码时带有参数的Read(e)再次执行数据读取．但此时的读取已经向服务端发送了页码．你明白了吗？
(13)：page_list.appendChild(li);为li写好了页码，绑定了事件以后添加到上面被获取的div元素里．请参阅：appendChild
哦了，上面讲述的部份是本次ajax分页教程中前端的核心部份，没有讲述的内容在前几篇的ajax教程里都有讲解．下面我们来看下服务端的源码并分析该源码
复制代码 代码如下:
<!--#include file="Conn.Asp"-->
<%
'出自：http://Www.Web666.Net
'作者：康董
'如需转载请务必保留以上信息
'定义一个变量，来保存xml数据
xml="<?xml version='1.0' encoding='gb2312'?><body>"
action=Request.QueryString("action") '使用get方式接受一个action来判断客户端想要执行什么操作
Select case action
case "read" '如果为read则执行读取数据的操作
Call Read
case else
xml = xml&"<msg>请求参数错误，请不要试图非法操作！</msg>"
End Select
xml=xml&"</body>"
Response.Clear
Response.ContentType="text/xml"
Response.CharSet="gb2312"
Response.write xml
Response.End
Sub Read '自定义的读取数据过程
Call OpenConn '打开数据库链接
Current_Page = Request("Current_Page") '当前的页码
PageCount = request("PageCount") '当前页显示的条数
xml = xml&"<page>"&pagecount&"</page>"
If Current_Page = "" Or Not IsNumEric(Current_Page) Then
Current_Page = 1
End If
If PageCount = "" Or Not IsNumEric(PageCount) Then '判断条数输入是否正确
PageCount = 5
End If
Sql = "Select count(*) From page_table" '读取page_table表中共有多少条数据
Set Rs = Conn.Execute(Sql) '执行sql语句
xml = xml&"<allrecord>"&Rs(0)&"</allrecord>"
If Current_Page = 1 Then '如果是第１页
Sql = "Select Top "&PageCount&" * From page_table order by id desc"
Else
Sql = "Select Top "&PageCount&" * From page_table where id<(Select Min(id) From (Select Top "&((Current_Page-1)*PageCount)&" id From page_table order by id desc)) order by id desc"
End If
Set Rs=Conn.Execute(Sql)
While Not Rs.Eof
xml = xml&"<list>"
xml = xml&"<id>"&Rs("id")&"</id>"
xml = xml&"<content>"&Rs("content")&"</content>"
xml = xml&"</list>"
Rs.MoveNext '下一条
Wend
End Sub
%>
上面是本次ajax分页教程实例中请求的服务端网页源码．我在服务端使用的是Asp技术，当然你也可以使用jsp,php,.net等轻松模拟．关于在服务端输出xml数据．在前几篇的ajax教程里我都有讲解．所以我们从该源码中的Read读取过程开始讲起：
1、Current_Page = Request("Current_Page") ：接收客户端ajax使用url参数传递过来的Current_page，请求的页码
2、PageCount = Request("PageCount") ：接收客端ajax使用url参数传递过来的PageCount，每页显示的条数
3、然后分别判断Current_Page是否为空．或者是否为数字．如果不符合条件．则将Current_page等于1．如果PageCount也为空，或者不是数字，则将PageCount等于5，也就是每页读取5条数据
4、Sql = "Select count(*) From page_table"这条sql的作用是读取表内一共有多少条数据，也就是我们在前端代码所说的总条数．将这个总条数读取以后并保存在一个allrecord的元素里．然后传回给客户端．客户端每次读取数据都会获取这个数字．以该数字为依据，进行页码的创建．
5、If Current_Page = 1 Then 判断Cruuent_Page是否为1，如果为1则执行：Sql = "Select Top "&PageCount&" * From page_table order by id desc" 该sql语句的意思很简单，只读取表内的"PageCount"条数据．如果你在前端没有设置要读取的条数．那么 PageCount等于5，也就是只读取5条数据．读取顺序为desc，倒序读取！
6、Else如果Crrent_Page不等于1,只有在你点击了页码列表中非第１页时，Current_Page才不会是1，那么就执行：Sql = "Select Top "&PageCount&" * From page_table where id<(Select Min(id) From (Select Top "&((Current_Page-1)*PageCount)&" id From page_table order by id desc)) order by id desc"，这条sql语句是分页的核心．他的大致意思是说：在表中读取PageCount条数据．这些数据的id必须小于已经显示出来的数据中id最小的那条数据．比如你点击的是第3页，每页显示的条数为5条．那么这第三页中要显示的数据的id，必须要小于第二页id最小的那条数据，因为是倒序读取．你明白了吗？如果你根本无法理解该Sql的意思．请恶补Sql的相关知识．下面的代码是从数据库里读取数据，我在前几篇都有过详细的讲解．ajax分页至此完毕！
提示：＜!--#include file="Conn.Asp"--＞Conn.asp是我的数据库链接文件．没什么特别．你应该可以自己写一个出来．网上也有很多现成的代码．本次读取的数据库表名为：page_table 字段分别为ID(自动编号)，content(数据内容)
今天就讲到这里，有什么不明白地方．请加 ajax技术交流群：110167482
在这段URL里，pagecount代表每页要显示几条数据，current_page代表要请求的页码．服务端就是根据这两个参数来传回你想要请求的数据．下面我们看下实例效果：
这是前端的ajax代码：
复制代码 代码如下:
<html>
<head>
<title>ajax数据分页</title>
<style>
body{
font-size:12px;
}
table{
border-collapse:collapse;
}
li{
list-style:none;
border:1px solid;
width:20px;
height:20px;
text-align:center;
margin:5px;
padding:2px;
float:left;
cursor:pointer;
}
</style>
</head>
<body>
默认显示每页为5条数据，你可以在下面文本框设置每页的显示条数<hr/>
输入每页要显示的条数:<input id="edit_count" type="text" /> <input type="button" type="button" value="确定" onclick="Read()"/>
<table border="1"><!--该表格用来显示数据内容-->
<thead><tr><td>编号</td><td>内容</td></tr></thead>
<tbody id="a"></tbody>
</table>
<span id="msg" style="color:red"></span>
<br/>
<ul id="page"><!--页导航-->
</ul>
<script type="text/javascript">
var All_page;//总页数
var All_record;//总条数
var Current_page;//当前页
var PageCount;//每页显示的条数
function ajax_xmlhttp(){
//在IE中创建xmlhttpRequest,适用于IE5.0以上所有版本
var msXmlhttp = new Array("Msxml2.XMLHTTP.5.0","Msxml2.XMLHTTP.4.0","Msxml2.XMLHTTP.3.0","Msxml2.XMLHTTP","Microsoft.XMLHTTP");
for(var i=0; i<msXmlhttp.length; i++){
try
{
_xmlhttp=new ActiveXObject(msXmlhttp[i]);
}
catch(e)
{
_xmlhttp=null;
}
} //循环创建基于IE浏览器的xmlhttp.结束
//如果非IE浏览器，则创建基于FireFox等浏览器的xmlhttpRequest
if(!_xmlhttp && typeof XMLHttpRequest != "undefined")
{
_xmlhttp=new XMLHttpRequest();
}
return _xmlhttp;
}
//获取元素函数
function $(elem){
return typeof elem == "string" ? document.getElementById(elem) : elem;
}
//读取数据函数
function Read(){
if(arguments.length!=0){//如果有参数传递过来，则证明你点击了某个页码
var e = arguments[0] || window.event; //标准化事件对象
var obj = e.target || e.srcElement; //获取事件对象,你点击的那个页码元素
Current_page = parseInt(obj.innerHTML);//获取元素中的数字值，证明你要请求的是第几页
$("msg").innerHTML = "当前为第"+Current_page+"页";//提示信息：当前请求的页
}
PageCount = $("edit_count").value;//获取文本框的值
if(PageCount.length == 0){ //如果文本框为空
PageCount = 5; //默认每页显示5条数据
}
var ajax = ajax_xmlhttp(); //将xmlhttprequest对象赋值给一个变量．
ajax.open("post","ajax_page.asp?action=read&pagecount="+PageCount+"& current_page="+Current_page,true);//设置请求方式，请求的网页，url的action参数为read，异步请求
ajax.onreadystatechange = function(){//你也可以这里指定一个已经写好的函数名称
if(ajax.readyState == 4){//数据返回成功
if(ajax.status == 200){//http请求状态码返回ok
var xmlData = ajax.responseXML;//以xml格式接收返回的数据，并保存在xmlData变量里
All_Record = xmlData.getElementsByTagName("allrecord")[0].firstChild.nodeValue;
All_page = All_Record / PageCount;
var page_list = $("page");
while(page_list.childNodes.length!=0){
page_list.removeChild(page_list.childNodes[0]);
}
for(var i=0;i<Math.ceil(All_page);i++){ //动态创建页码列表
var li = document.createElement("li");
li.innerHTML = i+1;//因为i以0开始，所以要+1显示页码
li.onclick = function(e){Read(e)};//为每个li的页码绑定单击事件
page_list.appendChild(li);//将生成好的页码元素放到div里
}
var list = xmlData.getElementsByTagName("list");//在返回的数据里，获取所有list标签
if(list.length!=0){
var t = document.getElementById("a");//获取展示数据的表格
while(t.rows.length!=0){ //在读取数据时如果表格已存在行．一律删除
t.removeChild(t.rows[0]);
}
for(var i=0;i<list.length;i++){
var tr = t.insertRow(t.rows.length);//有几个list就为表格增加几行．
var td = tr.insertCell(0);//第一个单元格存放数据编号
td.innerHTML = list[i].childNodes[0].firstChild.nodeValue;
var td = tr.insertCell(1);//第二个单元格存放数据内容
td.innerHTML = list[i].childNodes[1].firstChild.nodeValue;
}
}
}
}
}
ajax.send(null);//提交请求，参数为null
}
Read();//运行Read函数
</script>
</body>
</html>
上面是本次ajax分页教程的前端代码，html部份我们就不讲了．直接开始script中的内容．首先我们定义了4个全局变量，分别是：
All_page：总页数，创建页码的根据
All_Record：数据总条数，All_Record/PageCount=All_page 得到总页数
Current_page：当前请求的页码．传送给服务端
PageCount：每页显示的条数，传送给服务端
然后依次是我写的3个自定义函数，分别为：
ajax_xmlhttp();该函数的作用是创建一个可用的XMLHTTPRequest对象，如果你还不知道什么是XMLHTTPRequest．请了解什么是XMLHTTPRequest
$(elem);获取元素的函数，根据页面中元素的id来对某个元素的引用，其实就是document.getElementById的缩写与引用，写成函数以后直接可以使用$("元素id")即可获取该元素．
Read()：读取数据的函数．也是我们的老朋友了，在前几篇的教程里都有使用．下面我们仔细来分析下，这一次我们在Read()函数里做了些什么．
(1)：if(arguments.length!=0)这是在判断在调用Read()函数时，是否有参数传递过来．如果有参数，则证明你点击了某个页码而触发了Read()．这时我们应该获取该页码，将页码数字赋值给Crrent_page变量．点击了解：arguments
(2)：var e = arguments[0] || window.event;标准化事件对象，arguments[0]是为了FF浏览器，window.event是IE浏览器
(3)：var obj = e.target || e.srcElement;标准了事件对象以后，我们要获取事件的源．也就是说是那个元素触发了Read()函数．此时的obj就是你点击的那个页码元素．
(4)：Current_page = parseInt(obj.innerHTML);获取元素中的数字值，证明你要请求的是第几页，在下面的请求中会把该值发送给服务端．
(5)：PageCount = $("edit_count").value;获取文本框里的值，如果你没有向文本框里输入值．那么每页默认显示5条数据．再声明一次，以前讲过的内容我们不再重复讲解．也就是说关于上面的代码我在该教程里没有解释到的．在以前的教程里会找到相关解释．
(6)：ajax.open("post","ajax_page.asp?action=read&pagecount="+PageCount+"& current_page="+Current_page,true);我们在请求的Url里将Pagecount与Current_page变量传递给了服务端，服务端接收到这两个变量以后会经过判断．如果PageCount为空那么将默认为5．如果Current_page为空则默认为第1页，然后会将相应的数据传回给客户端．
(7)：All_Record = xmlData.getElementsByTagName("allrecord")[0].firstChild.nodeValue;从服务端接收一个allrecord标签元素．该元素包含了一个数字值，该数字值是数据的总条数．
(8)：All_page = All_Record / PageCount;用总条数All_Record除以PageCount等于总页，得出有几页数据以后．我们会根据All_page来创建当前页码列表．
(9)：var page_list = $("page");获取存放页码列表的那个div元素．while(page_list.childNodes.length!=0)循环遍历该div内的子元素．将其子元素全部删除．每次根据当前页显示的条数不同，会生成不同的页码，所以必须删除上次请求生成的页码列表，当然你也可以改进我这种做法！如果你还不了解什么是子元素或如何删除子元素，请参阅：childNodes与removeChild
(10)：for(var i=0;i < Math.ceil(All_page);i++);使用一个for循环根据总页数来动态的生成页码列表，如果All_page为5，则生成5个页码．因为考虑到了会有余数．我使用了Math.ceil．如果你还不知道Math与ceil的作用，请参阅：Math与ceil
(11)：var li = document.createElement("li");创建一个li元素，并赋值给一个名字为li的变量．li.innerHTML= i+1;在li元素内写入页码数值．因为i是从0开始的，所有要加1．
(12)：li.onclick = function(e){Read(e)};为每个li元素绑定单击事件，这个是重点必须要理解清楚．我们向li绑定了Read(e)函数，并且利用e参数传递了事件对象．当你点击每个页码的时候会再次触发Read函数来读取数据．这个时候运行的Read(e)函数，是带有参数的．我们正是从参数内获得了你请求的页码，然后赋值给Current_page，利用url发送给了服务端．
你注意一下在script脚本部份里的最后一行：Read();此时Read()没有参数，并且只有当打开页面或刷新页面时才会执行这个Read()，此时的Read()向服务端发送的Current_page是空的．PageCount默认是5，这个时候服务端接收到空的页码，只会读取5条数据给你．与此同时我也从服务端接收了数据的总条数，利用总条数除以每页显示的条数．创建了页码．并且为每个页码绑定了 Read(e)函数．只有当你点击这些页码时带有参数的Read(e)再次执行数据读取．但此时的读取已经向服务端发送了页码．你明白了吗？
(13)：page_list.appendChild(li);为li写好了页码，绑定了事件以后添加到上面被获取的div元素里．请参阅：appendChild
哦了，上面讲述的部份是本次ajax分页教程中前端的核心部份，没有讲述的内容在前几篇的ajax教程里都有讲解．下面我们来看下服务端的源码并分析该源码
复制代码 代码如下:
<!--#include file="Conn.Asp"-->
<%
'出自：http://Www.Web666.Net
'作者：康董
'如需转载请务必保留以上信息
'定义一个变量，来保存xml数据
xml="<?xml version='1.0' encoding='gb2312'?><body>"
action=Request.QueryString("action") '使用get方式接受一个action来判断客户端想要执行什么操作
Select case action
case "read" '如果为read则执行读取数据的操作
Call Read
case else
xml = xml&"<msg>请求参数错误，请不要试图非法操作！</msg>"
End Select
xml=xml&"</body>"
Response.Clear
Response.ContentType="text/xml"
Response.CharSet="gb2312"
Response.write xml
Response.End
Sub Read '自定义的读取数据过程
Call OpenConn '打开数据库链接
Current_Page = Request("Current_Page") '当前的页码
PageCount = request("PageCount") '当前页显示的条数
xml = xml&"<page>"&pagecount&"</page>"
If Current_Page = "" Or Not IsNumEric(Current_Page) Then
Current_Page = 1
End If
If PageCount = "" Or Not IsNumEric(PageCount) Then '判断条数输入是否正确
PageCount = 5
End If
Sql = "Select count(*) From page_table" '读取page_table表中共有多少条数据
Set Rs = Conn.Execute(Sql) '执行sql语句
xml = xml&"<allrecord>"&Rs(0)&"</allrecord>"
If Current_Page = 1 Then '如果是第１页
Sql = "Select Top "&PageCount&" * From page_table order by id desc"
Else
Sql = "Select Top "&PageCount&" * From page_table where id<(Select Min(id) From (Select Top "&((Current_Page-1)*PageCount)&" id From page_table order by id desc)) order by id desc"
End If
Set Rs=Conn.Execute(Sql)
While Not Rs.Eof
xml = xml&"<list>"
xml = xml&"<id>"&Rs("id")&"</id>"
xml = xml&"<content>"&Rs("content")&"</content>"
xml = xml&"</list>"
Rs.MoveNext '下一条
Wend
End Sub
%>
上面是本次ajax分页教程实例中请求的服务端网页源码．我在服务端使用的是Asp技术，当然你也可以使用jsp,php,.net等轻松模拟．关于在服务端输出xml数据．在前几篇的ajax教程里我都有讲解．所以我们从该源码中的Read读取过程开始讲起：
1、Current_Page = Request("Current_Page") ：接收客户端ajax使用url参数传递过来的Current_page，请求的页码
2、PageCount = Request("PageCount") ：接收客端ajax使用url参数传递过来的PageCount，每页显示的条数
3、然后分别判断Current_Page是否为空．或者是否为数字．如果不符合条件．则将Current_page等于1．如果PageCount也为空，或者不是数字，则将PageCount等于5，也就是每页读取5条数据
4、Sql = "Select count(*) From page_table"这条sql的作用是读取表内一共有多少条数据，也就是我们在前端代码所说的总条数．将这个总条数读取以后并保存在一个allrecord的元素里．然后传回给客户端．客户端每次读取数据都会获取这个数字．以该数字为依据，进行页码的创建．
5、If Current_Page = 1 Then 判断Cruuent_Page是否为1，如果为1则执行：Sql = "Select Top "&PageCount&" * From page_table order by id desc" 该sql语句的意思很简单，只读取表内的"PageCount"条数据．如果你在前端没有设置要读取的条数．那么 PageCount等于5，也就是只读取5条数据．读取顺序为desc，倒序读取！
6、Else如果Crrent_Page不等于1,只有在你点击了页码列表中非第１页时，Current_Page才不会是1，那么就执行：Sql = "Select Top "&PageCount&" * From page_table where id<(Select Min(id) From (Select Top "&((Current_Page-1)*PageCount)&" id From page_table order by id desc)) order by id desc"，这条sql语句是分页的核心．他的大致意思是说：在表中读取PageCount条数据．这些数据的id必须小于已经显示出来的数据中id最小的那条数据．比如你点击的是第3页，每页显示的条数为5条．那么这第三页中要显示的数据的id，必须要小于第二页id最小的那条数据，因为是倒序读取．你明白了吗？如果你根本无法理解该Sql的意思．请恶补Sql的相关知识．下面的代码是从数据库里读取数据，我在前几篇都有过详细的讲解．ajax分页至此完毕！
提示：＜!--#include file="Conn.Asp"--＞Conn.asp是我的数据库链接文件．没什么特别．你应该可以自己写一个出来．网上也有很多现成的代码．本次读取的数据库表名为：page_table 字段分别为ID(自动编号)，content(数据内容)
今天就讲到这里，有什么不明白地方．请加 ajax技术交流群：110167482
DDR爱好者之家 Design By 杰米
广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！
DDR爱好者之家 Design By 杰米
暂无评论...
稳了！魔兽国服回归的3条重磅消息！官宣时间再确认！
昨天有一位朋友在大神群里分享，自己亚服账号被封号之后居然弹出了国服的封号信息对话框。
这里面让他访问的是一个国服的战网网址，com.cn和后面的zh都非常明白地表明这就是国服战网。
而他在复制这个网址并且进行登录之后，确实是网易的网址，也就是我们熟悉的停服之后国服发布的暴雪游戏产品运营到期开放退款的说明。这是一件比较奇怪的事情，因为以前都没有出现这样的情况，现在突然提示跳转到国服战网的网址，是不是说明了简体中文客户端已经开始进行更新了呢？
更新日志
2024年11月26日
2024年11月26日
- 凤飞飞《我们的主题曲》飞跃制作[正版原抓WAV+CUE]
- 刘嘉亮《亮情歌2》[WAV+CUE][1G]
- 红馆40·谭咏麟《歌者恋歌浓情30年演唱会》3CD[低速原抓WAV+CUE][1.8G]
- 刘纬武《睡眠宝宝竖琴童谣 吉卜力工作室 白噪音安抚》[320K/MP3][193.25MB]
- 【轻音乐】曼托凡尼乐团《精选辑》2CD.1998[FLAC+CUE整轨]
- 邝美云《心中有爱》1989年香港DMIJP版1MTO东芝首版[WAV+CUE]
- 群星《情叹-发烧女声DSD》天籁女声发烧碟[WAV+CUE]
- 刘纬武《睡眠宝宝竖琴童谣 吉卜力工作室 白噪音安抚》[FLAC/分轨][748.03MB]
- 理想混蛋《Origin Sessions》[320K/MP3][37.47MB]
- 公馆青少年《我其实一点都不酷》[320K/MP3][78.78MB]
- 群星《情叹-发烧男声DSD》最值得珍藏的完美男声[WAV+CUE]
- 群星《国韵飘香·贵妃醉酒HQCD黑胶王》2CD[WAV]
- 卫兰《DAUGHTER》【低速原抓WAV+CUE】
- 公馆青少年《我其实一点都不酷》[FLAC/分轨][398.22MB]
- ZWEI《迟暮的花 (Explicit)》[320K/MP3][57.16MB]