科讯sql商业版中用到的ajax空间与分页函数,他们的js代码学习是非常不错的//ajax 控件 function PageAjax(){ var xhrObj=null; if(window.XMLHttpRequest) { xhrObj=new XMLHttpRequest(); } else if(window.ActiveXObject) { try{ xhrObj=new ActiveXObject("Microsoft.XMLHTTP"); } catch(e1) { try{ xhrObj=new ActiveXObject("MSXML2.XMLHTTP"); } catch(e2){ try{ xhrObj=new ActiveXObject("MSXML3.XMLHTTP"); } catch(e3){ alert("创建Ajax失败："+e3) } } } } else { alert("未能识别的浏览器"); } return xhrObj; } function Page(curPage,labelid,classid,installdir,url,refreshtype,specialid) { this.labelid=labelid; this.classid=classid; this.url=url; if (labelid.substring(0,5)=="{SQL_") { var slabelid=labelid.split('(')[0]; slabelid=slabelid.replace("{",""); this.c_obj="c_"+slabelid; this.p_obj="p_"+slabelid; } else { this.c_obj="c_"+labelid; this.p_obj="p_"+labelid; } this.installdir=installdir; this.refreshtype=refreshtype; this.specialid=specialid; this.page=curPage; loadData(1); } function loadData(p) { this.page=p; var xhr=new PageAjax(); xhr.open("get",installdir+url+"?labelid="+escape(labelid)+"&classid="+classid+"&refreshtype="+refreshtype+"&specialid=" +specialid+"&curpage="+p,true); xhr.onreadystatechange=function (){ if(xhr.readyState==1) { if (p==1) eval('document.all.'+c_obj).innerHTML="<div align='center'><img src='"+installdir+"images/loading.gif'>正在连接服务器...</div>"; } else if(xhr.readyState==2 || xhr.readyState==3) { if (p==1) eval('document.all.'+c_obj).innerHTML="<div align='center'><img src='"+installdir+"images/loading.gif'>正在读取数据...</div>"; } else if(xhr.readyState==4) { if (xhr.status==200) { var pagearr=xhr.responseText.split("{ks:page}") var pageparamarr=pagearr[1].split("|"); count=pageparamarr[0]; perpagenum=pageparamarr[1]; pagecount=pageparamarr[2]; itemunit=pageparamarr[3]; itemname=pageparamarr[4]; pagestyle=pageparamarr[5]; getObject(c_obj).innerHTML=pagearr[0]; pagelist(); } } } xhr.send(null); } function getObject(id) { if(document.getElementById) { return document.getElementById(id); } else if(document.all) { return document.all[id]; } else if(document.layers) { return document.layers[id]; } } function pagelist() { var n=1; var statushtml=null; switch(parseInt(this.pagestyle)) { case 1: statushtml="共"+this.count+this.itemunit+" <a href="javascript:homePage(1);" title="首页">首页</a> <a href="javascript:previousPage()" title="上一页">上一页</a> <a href="javascript:nextPage()" title="下一页">下一页</a> <a href="javascript:lastPage();" title="最后一页">尾页</a> 页次:<font color=red>"+this.page+"</font>/"+this.pagecount+"页 "+this.perpagenum+this.itemunit+this.itemname+"/页"; break; case 2: statushtml="<a href='#'>"+this.pagecount+"页/"+this.count+this.itemunit+"</a> <a href="javascript:homePage(1);" title="首页"><font face=webdings>9</font></a> <a href="javascript:previousPage()" title="上一页"><font face=webdings>7</font></a> "; var startpage=1; if (this.page==10) startpage=2; else if(this.page>10) startpage=eval((parseInt(this.page/10)-1)*10+parseInt((this.page)%10)+2); for(var i=startpage;i<=this.pagecount;i++){ if (i==this.page) statushtml+="<a href="#"><font color="#ff0000">"+i+"</font></a> " else statushtml+="<a href="javascript:turn("+i+")">"+i+"</a> " n=n+1; if (n>10) break; } statushtml+="<a href="javascript:nextPage()" title="下一页"><font face=webdings>8</font></a> <a href="javascript:lastPage();" title="最后一页"><font face=webdings>:</font></a>"; statushtml="<span class='kspage'>"+statushtml+"</span>"; break; case 4: statushtml="共"+this.pagecount+"页/"+this.count+this.itemunit+this.itemname+" <a href="javascript:homePage(1);" title="首页"><font face=webdings>9</font></a> <a href="javascript:previousPage()" title="上一页"><font face=webdings>7</font></a> "; for(var i=this.page;i<=this.pagecount;i++){ if (i==this.page) statushtml+="<b><font color="#ff0000">"+i+"</font></b> " else statushtml+="<a href="javascript:turn("+i+")">["+i+"]</a> " n=n+1; if (n>10) break; } statushtml+="<a href="javascript:nextPage()" title="下一页"><font face=webdings>8</font></a> <a href="javascript:lastPage();" title="最后一页"><font face=webdings>:</font></a>"; break; case 3: statushtml="第<font color=#ff000>"+this.page+"</font>页 共"+this.pagecount+"页 <a href="javascript:homePage(1);" title="首页"><<</a> <a href="javascript:previousPage()" title="上一页"><</a> <a href="javascript:nextPage()" title="下一页">></a> <a href="javascript:lastPage();" title="最后一页">>></a> "+this.perpagenum+this.itemunit+this.itemname+"/页"; break; } statushtml+=" 第<select name="goto" onchange="turn(parseInt(this.value));">"; for(var i=1;i<=this.pagecount;i++){ if (i==this.page) statushtml+="<option value='"+i+"' selected>"+i+"</option>"; else statushtml+="<option value='"+i+"'>"+i+"</option>"; } statushtml+="</select>页"; getObject(this.p_obj).innerHTML=statushtml; } function homePage() { if(this.page==1) alert("已经是首页了！") else loadData(1); } function lastPage() { if(this.page==this.pagecount) alert("已经是最后一页了！") else loadData(this.pagecount); } function previousPage() { if (this.page>1) loadData(this.page-1); else alert("已经是第一页了"); } function nextPage() { if(this.page<this.pagecount) loadData(this.page+1); else alert("已经到最后一页了"); } function turn(i) { loadData(i); }

　　推荐阅读

　　Expandable "Detail" Table Rows

A common UI is to have a table of data rows, which when clicked on expand to show a detailed breakdown of "child" rows below the "parent" row. The only requirements are: Put a class of "parent" on >>>详细阅读

本文标题：科讯商业版中用到的ajax空间与分页函数

地址：http://www.17bianji.com/kaifa2/JS/30111.html

 1/2    1