当前页面: 开发资料首页 → Javascript 专题 → 用数据岛生成翻页程序
摘要: 用数据岛生成翻页程序
<head>
</body>
<script>
//下面为初始化参数
var datanodes=data.documentElement.childNodes;
//下面三行保存副本,供删除以后恢复
var xmlDoc=document.all("data").XMLDocument;
var xmlDocTemp=new ActiveXObject("MSXML.DOMDocument");
xmlDocTemp.appendChild(xmlDoc.documentElement.cloneNode(true));
var totalrow=datanodes.length;//总数据行数
var pagerow=4;//每页行数
var totalpage=0;//总页数
if(totalrow!=0) {
if(totalrow%pagerow!=0) totalpage=parseInt(totalrow/pagerow)+1;
else totalpage=parseInt(totalrow/pagerow);
}
var currPage=1;//当前页码
var checkArr=new Array();//是否选中
var theValueArr=new Array();//记录选中记录的checkbox的value值
for(var i=0;i
checkArr[i]=0;//记录选中的记录0为未选中,1为选中,初始为0
theValueArr[i]="";
}
var buildArr=new Array();//保存当前页要生成的记录序号
var sortOrder='asce';//保存升序还是降序
mydiv.innerText="一共"+totalpage+"页"+totalrow+"条记录,当前为第1页,当前选中0条记录";
var nodes=head.documentElement.childNodes;
var nodeslen=nodes.length;
var attributes=head.documentElement.firstChild.attributes;
var objform=document.createElement("<form name='fjcl'>");
var objtable=document.createElement("<table bordercolor='#1EC600' border='1'>");
var objtbody=document.createElement("TBODY");
objtable.appendChild(objtbody);
</script>
<script language="javascript">
//生成表格头部
function addHead()
{
var objtr=document.createElement("<tr bgColor='#FFCCCC'>");
objtbody.appendChild(objtr);
var objtd=document.createElement("TD");
objtd.width="20";
objtd.innerText=" ";
objtr.appendChild(objtd);
for(var i=0;i
var objtd=document.createElement("<td onclick='' onmousemove=''>");
objtd.width=head.documentElement.childNodes.item(i).getAttribute("width");
objtd.onmousemove="style.cursor='hand'";
var sortBy=head.documentElement.childNodes.item(i).getAttribute("sortBy");
var sortType=head.documentElement.childNodes.item(i).getAttribute("sortType");
objtd.onclick="sort('"+sortBy+"','"+sortType+"','"+i+"')";
var tdtext=nodes.item(i).text+"→";
var objtext=document.createTextNode(tdtext);
objtd.appendChild(objtext);
objtr.appendChild(objtd);
}
objform.appendChild(objtable);
objbody.appendChild(objform);
objbody.appendChild(tableSec);
}
//添加符合条件的记录
function addAll()
{
var childdatanodes=data.documentElement.childNodes.item(0).childNodes;
var childtotalrow=childdatanodes.length;//每行下面可能的数据项长度
for(var i=0;i
var objtr;
if(i%2==0)
{
objtr=document.createElement("<tr onmouseover='' bgColor='#80FF80' class='first' onclick='changeColor()' >");
}else
{
objtr=document.createElement("<tr onmouseover='' bgColor='#FFFF80' class='first' onclick='changeColor()' >");
}
if(checkArr[buildArr[i]-1]==1) objtr.className="later";
objtr.onmouseover="style.cursor='hand'";
var thetd=document.createElement("TD");
var objCheckBox;
if(checkArr[buildArr[i]-1]==0)
{
objCheckBox=document.createElement("<input type='CHECKBOX' name='rad' value='' onclick=''>");
}else
{
objCheckBox=document.createElement("<input type='CHECKBOX' name='rad' value='' onclick='' checked>");
}
objCheckBox.onclick=objCheckBox.onclick+";if(this.checked==true) checkArr["+parseInt(buildArr[i]-1)+"]='1';else checkArr["+parseInt(buildArr[i]-1)+"]=0";
thetd.appendChild(objCheckBox);
objtr.appendChild(thetd);
for(var j=0;j
var isShow=datanodes.item(buildArr[i]-1).childNodes.item(j).getAttribute("isShow");//是否显示
var isKey=datanodes.item(buildArr[i]-1).childNodes.item(j).getAttribute("isKey"); //是否是主键
if(isShow=='1')//isShow=1
{
var objtd=document.createElement("<td onclick=''>");
var tdtext=document.createTextNode(datanodes.item(buildArr[i]-1).childNodes.item(j).text);
objtd.appendChild(tdtext);
objtr.appendChild(objtd);
objtd.onclick=objCheckBox.click;
}
if(isKey=='1')
{
if(objCheckBox.value=="")
objCheckBox.value=objCheckBox.value+datanodes.item(buildArr[i]-1).childNodes.item(j).tagName+"="+datanodes.item(buildArr[i]-1).childNodes.item(j).text;
else
objCheckBox.value=objCheckBox.value+"&"+datanodes.item(buildArr[i]-1).childNodes.item(j).tagName+"="+datanodes.item(buildArr[i]-1).childNodes.item(j).text;
}
}
theValueArr[buildArr[i]-1]=objCheckBox.value;
objtbody.appendChild(objtr);
}
objform.appendChild(objtable);
objbody.appendChild(objform);
objbody.appendChild(tableSec);
}
//翻页按钮操作
function show(thePage)
{
if(totalrow==0)
{
del();
addHead();
return false;
}
if(thePage=="first")
{
del();
addHead();
buildArr=new Array();
if(totalrow>=pagerow){
for(var i=1;i<=pagerow;i++)
buildArr[i-1]=i;
}else{
for(var i=1;i<=totalrow;i++)
buildArr[i-1]=i;
}
addAll();
currPage=1;
}else if(thePage=="prov")
{
if(currPage==1) return false;
del();
addHead();
buildArr=new Array();
for(var i=1;i<=pagerow;i++){
buildArr[i-1]=(currPage-2)*pagerow+i;
}
addAll();
currPage=currPage-1;
}else if(thePage=="next")
{
if(currPage==totalpage) return false;
del();
addHead();
buildArr=new Array();
if((currPage+1)*pagerow>=totalrow){
for(var i=1;i<=totalrow-currPage*pagerow;i++)
buildArr[i-1]=currPage*pagerow+i;
}else {
for(var i=1;i<=pagerow;i++)
buildArr[i-1]=currPage*pagerow+i;
}
addAll();
currPage=currPage+1;
}else if(thePage=="last")
{
if(currPage==totalpage) return false;
del();
addHead();
buildArr=new Array();
if(totalrow%pagerow==0){
for(var i=1;i<=pagerow;i++)
buildArr[i-1]=totalrow-pagerow+i;
}else{
for(var i=1;i<=totalrow%pagerow;i++)
buildArr[i-1]=totalrow-totalrow%pagerow+i;
}
addAll();
currPage=totalpage;
}
changeMyDiv();
}
//删除objform下面的所有内容
function del()
{
objform.removeNode(true);
objform=document.createElement("<form name='fjcl'>");
objtable=document.createElement("<table bordercolor='#1EC600' border='1'>");
objtbody=document.createElement("TBODY");
objtable.appendChild(objtbody);
}
//改变颜色
function changeColor()
{
for(var i=0;i
var theRow=buildArr[i]-1;
if(checkArr[theRow]==0)
{
objtbody.childNodes.item(i+1).className="first";
}
else
{
objtbody.childNodes.item(i+1).className="later";
}
}
changeMyDiv();
}
function changeMyDiv()
{
var totalChecked=0;//记录当前选中记录数
for(var i=0;i
if(checkArr[i]==1) totalChecked+=1;
}
mydiv.innerText="一共"+totalpage+"页"+totalrow+"条记录,当前为第"+currPage+"页,当前选中"+totalChecked+"条记录";
}
function showValue() var myxm=xm.value; }
{
var str="";
var str2="";
for(var i=0;i
str+=checkArr[i]+";";
if(checkArr[i]==1) str2+=theValueArr[i]+";";
}
alert(str);
alert(str2);
}
//跳转到某个页
function goPageNum()
{
var page=pageNum.value;
if(totalrow==0)
{
alert("没有可操作的记录!");
return false;
}
if(page.length==0)
{
alert("请输入要跳转的页码!");
return false;
}
if(parseInt(page)==0||parseInt(page)>totalpage)
{
alert("输入页码应介于1和"+totalpage+"之间!");
return false;
}
if(page==currPage) return false;
if(page==1)
{
show('first');
}else if(page==totalpage)
{
show('last');
}else
{
del();
addHead();
buildArr=new Array();
for(var i=0;i
}
addAll();
currPage=page;
}
changeMyDiv();
}
function yourFunction()
{
if(totalrow==0)
{
alert("没有可操作的记录!");
return false;
}
var totalChecked=0;//记录当前选中记录数
for(var i=0;i
if(checkArr[i]==1) totalChecked+=1;
}
if(totalChecked==0)
{
alert("没有选中记录,请选择后进行操作!");
return false;
}
var pk='';
for(var i=0;i
if(checkArr[i]==1)
pk+=theValueArr[i]+";";
}
alert(pk);
var temp=datanodes.item(nodeNo).getElementsByTagName("username");
if(temp.item(0).text.indexOf(myxm)!=-1) return true;
return false;
</script>