Ajax讀取數(shù)據(jù)之分頁顯示篇實現(xiàn)代碼

html>
head>
title>ajax數(shù)據(jù)分頁/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條數(shù)據(jù)，你可以在下面文本框設置每頁的顯示條數(shù)hr/>
輸入每頁要顯示的條數(shù):input id="edit_count" type="text" /> input type="button" type="button" value="確定" onclick="Read()"/>
table border="1">!--該表格用來顯示數(shù)據(jù)內容-->
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;//總頁數(shù)
var All_record;//總條數(shù)
var Current_page;//當前頁
var PageCount;//每頁顯示的條數(shù)
function ajax_xmlhttp(){
//在IE中創(chuàng)建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; imsXmlhttp.length; i++){
try
{
_xmlhttp=new ActiveXObject(msXmlhttp[i]);
}
catch(e)
{
_xmlhttp=null;
}
} //循環(huán)創(chuàng)建基于IE瀏覽器的xmlhttp.結束
//如果非IE瀏覽器，則創(chuàng)建基于FireFox等瀏覽器的xmlhttpRequest
if(!_xmlhttp typeof XMLHttpRequest != "undefined")
{
_xmlhttp=new XMLHttpRequest();
}
return _xmlhttp;
}
//獲取元素函數(shù)
function $(elem){
return typeof elem == "string" ? document.getElementById(elem) : elem;
}
//讀取數(shù)據(jù)函數(shù)
function Read(){
if(arguments.length!=0){//如果有參數(shù)傳遞過來，則證明你點擊了某個頁碼
var e = arguments[0] || window.event; //標準化事件對象
var obj = e.target || e.srcElement; //獲取事件對象,你點擊的那個頁碼元素
Current_page = parseInt(obj.innerHTML);//獲取元素中的數(shù)字值，證明你要請求的是第幾頁
$("msg").innerHTML = "當前為第"+Current_page+"頁";//提示信息：當前請求的頁
}
PageCount = $("edit_count").value;//獲取文本框的值
if(PageCount.length == 0){ //如果文本框為空
PageCount = 5; //默認每頁顯示5條數(shù)據(jù)
}
var ajax = ajax_xmlhttp(); //將xmlhttprequest對象賦值給一個變量．
ajax.open("post","ajax_page.asp?action=readpagecount="+PageCount+" current_page="+Current_page,true);//設置請求方式，請求的網(wǎng)頁，url的action參數(shù)為read，異步請求
ajax.onreadystatechange = function(){//你也可以這里指定一個已經(jīng)寫好的函數(shù)名稱
if(ajax.readyState == 4){//數(shù)據(jù)返回成功
if(ajax.status == 200){//http請求狀態(tài)碼返回ok
var xmlData = ajax.responseXML;//以xml格式接收返回的數(shù)據(jù)，并保存在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;iMath.ceil(All_page);i++){ //動態(tài)創(chuàng)建頁碼列表
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");//在返回的數(shù)據(jù)里，獲取所有l(wèi)ist標簽
if(list.length!=0){
var t = document.getElementById("a");//獲取展示數(shù)據(jù)的表格
while(t.rows.length!=0){ //在讀取數(shù)據(jù)時如果表格已存在行．一律刪除
t.removeChild(t.rows[0]);
}
for(var i=0;ilist.length;i++){
var tr = t.insertRow(t.rows.length);//有幾個list就為表格增加幾行．
var td = tr.insertCell(0);//第一個單元格存放數(shù)據(jù)編號
td.innerHTML = list[i].childNodes[0].firstChild.nodeValue;
var td = tr.insertCell(1);//第二個單元格存放數(shù)據(jù)內容
td.innerHTML = list[i].childNodes[1].firstChild.nodeValue;
}
}
}
}
}
ajax.send(null);//提交請求，參數(shù)為null
}
Read();//運行Read函數(shù)
/script>
/body>
/html>

!--#include file="Conn.Asp"-->
%
'出自：http://Www.Web666.Net
'作者：康董
'如需轉載請務必保留以上信息
'定義一個變量，來保存xml數(shù)據(jù)
xml="?xml version='1.0' encoding='gb2312'?>body>"
action=Request.QueryString("action") '使用get方式接受一個action來判斷客戶端想要執(zhí)行什么操作
Select case action
case "read" '如果為read則執(zhí)行讀取數(shù)據(jù)的操作
Call Read
case else
xml = xml"msg>請求參數(shù)錯誤，請不要試圖非法操作！/msg>"
End Select
xml=xml"/body>"
Response.Clear
Response.ContentType="text/xml"
Response.CharSet="gb2312"
Response.write xml
Response.End

Sub Read '自定義的讀取數(shù)據(jù)過程
Call OpenConn '打開數(shù)據(jù)庫鏈接
Current_Page = Request("Current_Page") '當前的頁碼
PageCount = request("PageCount") '當前頁顯示的條數(shù)
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 '判斷條數(shù)輸入是否正確
PageCount = 5
End If
Sql = "Select count(*) From page_table" '讀取page_table表中共有多少條數(shù)據(jù)
Set Rs = Conn.Execute(Sql) '執(zhí)行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
%>