การแบ่งหน้า Xml_javascript
ผู้เขียน：Eve Cole
เวลาอัปเดต：2009-07-07 16:22:09
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns=" http://www.w3.org/1999/xhtml " >
<หัว>
<title>龙的传人--Xml_javascript分页</title>
</หัว>
<body onload="getxmlDoc()">
<script language="javascript" type="text/javascript">
var xmlDoc;
var nodeIndex;
var pageIndex;
var pageSize=13;
var หน้าสุดท้าย; //最后一页
var overSize // 最后一页的记录数
ฟังก์ชั่น getxmlDoc()
-
xmlDoc=ใหม่ ActiveXObject("Microsoft.XMLDOM");
var currNode;
xmlDoc.async=false;
xmlDoc.load("myTest.xml");
ถ้า(xmlDoc.parseError.errorCode!=0)
-
var myErr=xmlDoc.parseError;
alert("出错！"+myErr.reason);
-
getRecordCount();
onFirst();
-
ฟังก์ชั่น getRecordCount()
-
var personNode= xmlDoc.selectNodes("/รูท")[0];
var recordCount=personNode.childNodes.length;
var pageCount=Math.ceil(recordCount/pageSize);
document.getElementById("txtPageCount").value=pageCount;
document.getElementById("txtRecordCount").value=recordCount;
overSize=recordCount%pageSize;
ถ้า(ขนาดเกิน>0)
-
LastPage=recordCount-overSize;
-
อื่น
-
LastPage=recordCount-pageSize;
-
-
ฟังก์ชั่น getPageRecord (pageIndex, ขนาดหน้า)
-
clearRow("myTable");
var personNode= xmlDoc.selectNodes("/รูท")[0];
var currNode=personNode.childNodes[pageIndex];
สำหรับ(var i=pageIndex;i<pageIndex+pageSize;i++)
-
var arr=อาร์เรย์ใหม่();
var nNode= xmlDoc.selectSingleNode("รูท/บุคคล["+i+"]") ;
arr[0]=nNode.getAttribute("รหัส"); //序号
arr[1]=nNode.childNodes[0].ข้อความ; //工号
arr[2]=nNode.childNodes[1].ข้อความ; //姓名
arr[3]=nNode.childNodes[2].ข้อความ; // 性别
arr[4]=nNode.childNodes[3].ข้อความ; //部门
arr[5]=nNode.childNodes[4].ข้อความ; //职位
arr[6]=nNode.childNodes[5].ข้อความ; //地址
// arr[0]=personNode.childNodes[i].getAttribute("Id"); //序号
// arr[1]=personNode.childNodes[i].childNodes[0].text; //工号
// arr[2]=personNode.childNodes[i].childNodes[1].text; //姓名
// arr[3]=personNode.childNodes[i].childNodes[2].text; // 性别
// arr[4]=personNode.childNodes[i].childNodes[3].text; //部门
// arr[5]=personNode.childNodes[i].childNodes[4].text; //职位
// arr[6]=personNode.childNodes[i].childNodes[5].text; //地址
addRow(i+1,"myTable",arr);
-
-
ฟังก์ชั่น onFirst()
-
ดัชนีหน้า=0;
var currIndex=pageIndex;
getPageRecord (currIndex, ขนาดหน้า)
pageIndex=currIndex ;
document.getElementById("txtCurrPage").value=(pageIndex / ขนาดหน้า) + 1;
document.getElementById("txtCurrPageRecord").value=pageSize;
-
ฟังก์ชั่น onPrev()
-
var currIndex=pageIndex;
currIndex-=ขนาดหน้า;
getPageRecord (currIndex, ขนาดหน้า)
pageIndex=currIndex;
document.getElementById("txtCurrPage").value=(pageIndex / ขนาดหน้า) + 1;
document.getElementById("txtCurrPageRecord").value=pageSize;
-
ฟังก์ชั่น onNext()
-
var currIndex=pageIndex;
currIndex+=ขนาดหน้า;
getPageRecord (currIndex, ขนาดหน้า)
pageIndex=currIndex;
document.getElementById("txtCurrPage").value=(pageIndex / ขนาดหน้า) + 1;
document.getElementById("txtCurrPageRecord").value=pageSize;
-
ฟังก์ชั่น onLast()
-
ถ้า(ขนาดเกิน>0)
-
getPageRecord (หน้าสุดท้าย, overSize)
document.getElementById("txtCurrPageRecord").value=overSize;
-
อื่น
-
getPageRecord (หน้าสุดท้าย, ขนาดหน้า)
document.getElementById("txtCurrPageRecord").value=pageSize;
-
pageIndex=หน้าสุดท้าย;
document.getElementById("txtCurrPage").value=(pageIndex / ขนาดหน้า) + 1;
-
ฟังก์ชั่น toPage()
-
var index=document.getElementById("txtCurrPage").value
var currIndex=(ดัชนี-1)*ขนาดหน้า;
ถ้า(event.keyCode==13)
-
getPageRecord(currIndex, ขนาดหน้า);
-
pageIndex=currIndex;
-
ฟังก์ชั่น addRow (i, dataGridId, arr)
-
var แถว=document.createElement("tr");
เซลล์ var=createCellWidthText(i);
row.appendChild (เซลล์);
สำหรับ(var j=0;j<arr.length;j++)
-
เซลล์ = createCellWidthText (arr [j]);
row.appendChild (เซลล์);
-
document.getElementById(dataGridId).firstChild.appendChild(แถว);
-
ฟังก์ชั่น createCellWidthText (ข้อความ)
-
เซลล์ var = document.createElement("td");
var textNode = document.createTextNode (ข้อความ);
เซลล์ผนวกเด็ก (textNode);
กลับเซลล์;
-
ฟังก์ชั่น clearRow (obj)
-
ตาราง var=document.getElementById(obj);
var nodeTbody=table.firstChild
ความยาว var=nodeTbody.childNodes.length;
สำหรับ (var i=length-1;i>0;i--)
-
nodeTbody.removeChild(nodeTbody.childNodes[i]);
-
-
</สคริปต์>
<form id="form1" runat="server">
<div>
<table align="center" style="border-right: #0033ff ทึบบาง; border-top: #0033ff ทึบบาง;
ขอบซ้าย: #0033ff ทึบบาง; ความกว้าง: 650px; ขอบล่าง: #0033ff ทึบบาง">
<tr>
<td>
共<input id="txtPageCount" name="txtPageCount" style="width: 33px; color: #0000ff; border-top-style: none; border-right-style: none; border-left-style: none; พื้นหลัง -สี: โปร่งใส; ลักษณะขอบล่าง: ไม่มี;" type="text" onkeydown="toPage()"/>页/
<input id="txtRecordCount" name="txtRecordCount" style="width: 46px; color: #3300ff; border-top-style: none; border-right-style: none; border-left-style: none; พื้นหลัง- สี: โปร่งใส; ลักษณะขอบล่าง: ไม่มี;" type="text" onkeydown="toPage()"/>条记录
<input id="btnFirst" type="button" value="首页" onclick="onFirst()"/>
<input id="btnPrev" type="button" value="上一页" onclick="onPrev()"/>
<input id="btnNext" type="button" value="下一页" onclick="onNext()"/>
<input id="btnLast" type="button" value="尾页" onclick="onLast()"/>
第<input id="txtCurrPage" name="txtCurrPage" style="width: 46px; color: #ff3333;" ประเภท = "ข้อความ" onkeydown = "toPage()"/>
页(当前页<input id="txtCurrPageRecord" name="txtCurrPageRecord" style="width: 22px; color: #ff3333; border-top-style: none; border-right-style: none; border-left-style: ไม่มี ไม่มี; สีพื้นหลัง: สีขาว; border-bottom-style: none;" type="text" onkeydown="toPage()"/>条记录）</td>
</tr>
<tr>
<td>
<table width="100%" id="myTable">
<tr style="พื้นหลังสี:สีเหลือง">
<td style="width: 34px; height: 21px;">
รหัส</td>
<td style="width: 34px; height: 21px;">
序号</td>
<td style="width: 42px; height: 21px;">
工号</td>
<td style="width: 36px; height: 21px;">
姓名</td>
<td style="width: 39px; height: 21px;">
性别</td>
<td style="width: 43px; height: 21px;">
部门</td>
<td style="width: 50px; height: 21px;">
职位</td>
<td style="width: 100px; height: 21px;">
地址</td>
</tr>
</ตาราง>
</td>
</tr>
</ตาราง>
</div>
</แบบฟอร์ม>
</ร่างกาย>
</html>
ที่มา: http://home.goofar.com/lkc311/Default.htm
