JAVASCRIPT分页(读取xml文件中的记录)

最近做一个网站,为了减少数据库的访问,将所有数据都建了个xml索引,前台页面中的数据都从xml文件中读取,但是为要实现新闻列表的分页不能使用asp.net的控件了,只好使用javascript来分页,代码如下:


var xmlDoc;


var nodeIndex;


var pageIndex;


var pageSize=20;


var lastPage; //最后一页


var overSize ; //最后一页的记录数


var listStr='';


var recordCount=0;




function getxmlDoc(path) //读取xml文件




...{


document.getElementById("txtPageCount").readOnly=true;


document.getElementById("txtRecordCount").readOnly=true;


document.getElementById("txtCurrPage").readOnly=true;


document.getElementById("txtCurrPageRecord").readOnly=true;


xmlDoc=new ActiveXObject("Microsoft.XMLDOM");


var currNode;


xmlDoc.async=false;


path="../news/"+path;


xmlDoc.load(path);


if(xmlDoc.parseError.errorCode!=0)




...{


var myErr=xmlDoc.parseError;


alert("出错！"+myErr.reason);


}


getRecordCount();


if(recordCount<pageSize)


onLast();


else onFirst();


}


function getRecordCount() //获得记录信息




...{


var rootNode=xmlDoc.documentElement;


recordCount=rootNode.childNodes.length;


var pageCount=Math.ceil(recordCount/pageSize);


document.getElementById("txtPageCount").value=pageCount;


document.getElementById("txtRecordCount").value=recordCount;


overSize=recordCount%pageSize;


if(overSize>0)




...{


lastPage=recordCount-overSize;


}


else




...{


lastPage=recordCount-pageSize;


}


}


function getPageRecord(pageIndex,pageSize) //读取xml文件中的记录




...{


clearRow("myTable");


var rootNode= xmlDoc.documentElement;


var currNode=rootNode.childNodes[pageIndex];


listStr='<ul>';


for(var i=pageIndex;i<pageIndex+pageSize&&i<rootNode.childNodes.length;i++)




...{


var arr=new Array();


var nNode= xmlDoc.documentElement.childNodes[i];


title=nNode.childNodes[0].text; //标题


time=nNode.childNodes[1].text;


time=time.substring(2,10); //日期


url=nNode.childNodes[2].text; //URL


//alert(title);


listStr=listStr+'<li><a href="'+url+'">'+title+'</a><span class="list_time">  ['+time+']</span></li>';


}


if(pageIndex>=lastPage)document.getElementById("btnnext").style.display="none";


else document.getElementById("btnnext").style.display="";


if(pageIndex==0)document.getElementById("btnprev").style.display="none";


else document.getElementById("btnprev").style.display="";


listStr=listStr+'</ul>';


document.getElementById("myTable").innerHTML=listStr;


}


function onFirst() //当点击首页的时候触发




...{


if(recordCount<pageSize)




...{


onLast();


return;


}


pageIndex=0;


var currIndex=pageIndex;


getPageRecord(currIndex,pageSize);


pageIndex=currIndex ;


document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;


document.getElementById("txtCurrPageRecord").value=pageSize;


}


function onPrev() //点击上一页时触发




...{


var currIndex=pageIndex;


currIndex-=pageSize;


getPageRecord(currIndex,pageSize)


pageIndex=currIndex;


document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;


document.getElementById("txtCurrPageRecord").value=pageSize;




}


function onNext() //点击下一页的时候触发




...{


var currIndex=pageIndex;


currIndex+=pageSize;


getPageRecord(currIndex,pageSize);


pageIndex=currIndex;


document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;


document.getElementById("txtCurrPageRecord").value=pageSize;




}


function onLast() //点击最后一页的时候触发




...{


if(overSize>0)




...{


getPageRecord(lastPage,overSize)


document.getElementById("txtCurrPageRecord").value=overSize;


}


else




...{


getPageRecord(lastPage,pageSize)


document.getElementById("txtCurrPageRecord").value=pageSize;


}


pageIndex=lastPage;


document.getElementById("txtCurrPage").value=(pageIndex / pageSize) + 1;


}


function toPage() //转向指定页




...{


var index=document.getElementById("txtCurrPage").value


var currIndex=(index-1)*pageSize;


if(event.keyCode==13)




...{


getPageRecord(currIndex,pageSize);


}


pageIndex=currIndex;


}




function clearRow(obj) //清除页面中的一个标记之间的内容




...{


var table=document.getElementById(obj);


var length=table.childNodes.length;


for(var i=length-1;i>0;i--)




...{


table.removeChild(table.childNodes[i]);


}


}

以上是javascript脚本,下面是页面文件:




<%...@ Page Language="C#" %>




<!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" >


<head >


<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />


<title>通知公告</title>


<link href="../css/body.css" rel="stylesheet" type="text/css" media="screen" />


<link href="../css/index_news_list.css" rel="stylesheet" type="text/css" media="screen" />


<script src="../js/page.js" type="text/javascript" language="javascript" ></script>


</head>


<body onload='getxmlDoc("notice_list.xml")'>


<div id="hd">


<iframe width="100%" height="160" frameborder=0 scrolling="no" src="../nav.htm"></iframe>


</div>


<div id="box" style="">




<form id="myform" action="../search.aspx" onsubmit ="search_submit();return false;">


<div style="text-align:left;line-height:20px;height:20px; ">


<asp:SiteMapPath ID="SiteMapPath1" runat="server" Font-Names="宋体" Font-Size="12px"


PathSeparator=" : " >


<PathSeparatorStyle Font-Bold="False" ForeColor="#990000" />


<CurrentNodeStyle ForeColor="#333333" />


<NodeStyle Font-Bold="False" ForeColor="#990000" />


<RootNodeStyle Font-Bold="False" ForeColor="#FF8000" />


<PathSeparatorTemplate>


>>


</PathSeparatorTemplate>


</asp:SiteMapPath>




<input name="key" style="width:100px;margin-top:2px;height:16px;"/>


<select name="search_type" style="width:80px;height:20px;">


<option value="1" style="height:50px;">标题</option>


<option value="2">全文</option>


</select>




<input type="submit" value="搜索" style="background-image:url(../media/btn_bg.gif);height:20px;border:0;width:59px;"/>


</div>


</form>


<hr style="color: #018C6F;" />


<div id="left_side_div">


<ul>


<!-- 菜单条目-->


<li><a id="current" href="news_notice_list.aspx">通知公告</a></li>


<li><a href="news_picnews_list.aspx">图片新闻</a></li>


<li><a href="keji_dongtai_list.aspx">科技动态</a></li>


<li><a href="keji_zixun_list.aspx">科技资讯</a></li>


<li><a href="news_policy_list.aspx">政策法规</a></li>


<li><a href="news_peixun_list.aspx">培训信息</a></li>


</ul>


</div>


<div id="right_side_div">


<table width="475" align="left" >


<tr width="596">


<td >


<div width="100%" id="myTable">


</div>


</td>


</tr>


<tr >


<td style="height: 19px;">


<div id="nav"> 每页20条 当前页


<input id="txtCurrPageRecord" type="text" onkeydown="toPage()"/>条


共有<input id="txtRecordCount" 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" type="text" onkeydown="toPage()"/>/


<input id="txtPageCount"type="text" onkeydown="toPage()"/>


页


</div>


</td>


</tr>


</table>


</div>


</div>


<div id="ft">


<iframe width="100%" height="80" frameborder=0 scrolling="no" src="../foot.htm"></iframe>


</div>




</body>


</html>



xml文件格式如下:


<?xml version="1.0" standalone="yes"?>


<NewDataSet>


<news>


<title>合肥工业大学</title>


<time>2007-04-18T00:00:00+08:00</time>


<url>txtfile/20070426221413.htm</url>


</news>


<news>


<title>合肥工业大学计算机</title>


<time>2007-04-27T00:00:00+08:00</time>


<url>notice/20070427184855.htm</url>


</news>


<news>


<title>计算机2班</title>


<time>2007-04-17T00:00:00+08:00</time>


<url>notice/20070427193529.htm</url>


</news>


<news>


<title>ssssss</title>


<time>2007-04-11T00:00:00+08:00</time>


<url>notice/20070427220218.htm</url>


</news>


</NewDataSet>

请大家指点!!谢谢