<SCRIPT language=JavaScript type=text/javascript>//主要用于页面排序var curObj;var globalColIndex=0;//表示没有排序var noSort="0";//表示升序var ascSort="1";//表示降序var descSort="2";var tableRowDataArr=new Array();//数据数组var theDataRowsArr=new Array();//标题数组var theTitleRowsArr=new Array();//列排序标记数组var tableColSortFlagArr=new Array();function sortTable(tempColIndex,imageName) { var prefix_str="imagerorder"; var suffix_str="_0"; var image_path="/test/sort/"; sortTableForProceeding(tempColIndex,imageName,tableRowDataArr,theDataRowsArr ,theTitleRowsArr,tablesortlist,tableColSortFlagArr,prefix_str,suffix_str,image_path);}</SCRIPT>
//排序函数脚本function sortTableForProceeding(tempColIndex,imageName,tableRowDataArr ,theDataRowsArr,theTitleRowsArr,tablesortlist,tableColSortFlagArr ,prefix_str,suffix_str ,image_path){ var start=new Date() var i; var imageObj=null; if(tablesortlist.rows.length==2){ if(tablesortlist.rows[1].cells.length==1){ return ; } } initColSortFlag(tablesortlist,tableColSortFlagArr); //把第一行的标题行数据装入数组中 for(i=0;i<tablesortlist.rows.length;i++) { theTitleRowsArr[i]=new Array(tablesortlist.rows[i].cells[tempColIndex].innerText.toLowerCase(),tablesortlist.rows[i].outerHTML); } //alert(tablesortlist.rows[1].cells[tempColIndex].innerText.toLowerCase()); //把数据装入数组中 for(i=0;i<tablesortlist.rows.length;i++) { //过滤掉标题行 if(i==0){ theDataRowsArr[i]=new Array("",""); } else{ theDataRowsArr[i]=new Array(tablesortlist.rows[i].cells[tempColIndex].innerText.toLowerCase(),tablesortlist.rows[i].outerHTML); } //alert(theDataRowsArr[i]); //alert("2:"+tablesortlist.rows[i].outerHTML); } //排序 //alert(tableColSortFlagArr[tempColIndex]+"&tempColIndex:"+tempColIndex); //一开始是没有排序 if(tableColSortFlagArr[tempColIndex]==noSort){ theDataRowsArr.sort(sortRowsDesc); tableColSortFlagArr[tempColIndex]=descSort; } else{ if(tableColSortFlagArr[tempColIndex]==ascSort){ theDataRowsArr.sort(sortRowsDesc); tableColSortFlagArr[tempColIndex]=descSort; } else{ if(tableColSortFlagArr[tempColIndex]==descSort){ theDataRowsArr.sort(sortRowsAsc); tableColSortFlagArr[tempColIndex]=ascSort; } } } //alert(tableColSortFlagArr[tempColIndex]); var str=''; var tempStr=''; for(i=0;i<theDataRowsArr.length;i++) { if(i==0){ str+=theTitleRowsArr[i][1]; str+=theDataRowsArr[i][1]; } else{ tempStr=theDataRowsArr[i][1]; if(i % 2==0){ if(tempStr.indexOf('<TR class=rowoutdark2 align=middle>')>=0){ tempStr=tempStr.replace('<TR class=rowoutdark2 align=middle>','<TR class=rowoutdark align=middle>'); } } else{ if(tempStr.indexOf('<TR class=rowoutdark align=middle>')>=0){ tempStr=tempStr.replace('<TR class=rowoutdark align=middle>','<TR class=rowoutdark2 align=middle>'); } } theDataRowsArr[i][1]=tempStr; str+=theDataRowsArr[i][1]; } } tablesortlist.outerHTML='<table id="tablesortlist" width="100%" border="0" align="center" cellpadding="3" cellspacing="1" bgcolor="#A0A0A0">'+str+'</table>' curObj=null; //变换图片 imageObj=getFormObjectByObjectName(imageName); //alert("adfsaf:"+imageObj+"&I:"+tableColSortFlagArr[tempColIndex]); if(imageObj!=null){ if(tableColSortFlagArr[tempColIndex]==ascSort){ imageObj.setAttribute("src",image_path+"images/downarrow.gif"); imageObj.setAttribute("width","10"); imageObj.setAttribute("height","10"); //alert("adfsaf:"+imageObj+"&I:"+tableColSortFlagArr[tempColIndex]); } if(tableColSortFlagArr[tempColIndex]==descSort){ imageObj.setAttribute("src",image_path+"images/uparrow.gif"); imageObj.setAttribute("width","10"); imageObj.setAttribute("height","10"); //alert("adfsaf:"+imageObj+"&I:"+tableColSortFlagArr[tempColIndex]); } } //alert(imageObj); //清除图片 for(i=0;i<tablesortlist.rows.length;i++) { if(i==0){ for (j=0;j<tablesortlist.rows(i).cells.length;j++) { if(tempColIndex!=j){ tableColSortFlagArr[j]=noSort; } if(tableColSortFlagArr[j]==noSort){ //alert("j:"+j+"&tableColSortFlagArr:"+tableColSortFlagArr[j]); imageObj=getFormObjectByObjectName(prefix_str+j+suffix_str); if(imageObj!=null){ imageObj.setAttribute("src",""); imageObj.setAttribute("width","0"); imageObj.setAttribute("height","0"); } } } } break; } return ;}
function initColSortFlag(tablesortlist,tableColSortFlagArr){ //保存排序标记 for(i=0;i<tablesortlist.rows.length;i++) { if(i==0){ for (j=0;j<tablesortlist.rows(i).cells.length;j++) { if(tableColSortFlagArr[j]==null){ tableColSortFlagArr[j]=noSort; } } } break; }}
以下是使用示例，排序页面如下：
<TABLE id=tablesortlist cellSpacing=1 cellPadding=3 width="100%" align=center bgColor=#a0a0a0 border=0> <TBODY> <TR class=rowoutlight align=middle bgColor=#c9d8ff> <TD width="5%">全选 <INPUT type=checkbox value=checkbox name=chkall></TD> <TD οnclick="javascript:sortTable('1','imagerorder1_0');" width="15%"><DIV align=center><FONT title=点击标题，进行数据排序 style="CURSOR: hand">项目名称</FONT> <IMG title="" height=1 src="/arrowdown.gif" width=1 name=imagerorder1_0> </DIV></TD> <TD οnclick="javascript:sortTable('2','imagerorder2_0');" width="15%"><DIV align=center><FONT title=点击标题，进行数据排序 style="CURSOR: hand">项目类型</FONT> <IMG title="" height=1 src="/arrowdown.gif" width=1 name=imagerorder2_0> </DIV></TD> <TD οnclick="javascript:sortTable('3','imagerorder3_0');" width="14%"><DIV align=center><FONT title=点击标题，进行数据排序 style="CURSOR: hand">项目类别</FONT> <IMG title="" height=1 src="/arrowdown.gif" width=1 name=imagerorder3_0> </DIV></TD> <TD οnclick="javascript:sortTable('4','imagerorder4_0');" width="10%"><DIV align=center><FONT title=点击标题，进行数据排序 style="CURSOR: hand">申请者名称</FONT> <IMG title="" height=1 src="/arrowdown.gif" width=1 name=imagerorder4_0> </DIV></TD> <TD οnclick="javascript:sortTable('5','imagerorder5_0');" width="13%"><DIV align=center><FONT title=点击标题，进行数据排序 style="CURSOR: hand">联系电话</FONT> <IMG title="" height=1 src="/arrowdown.gif" width=1 name=imagerorder5_0> </DIV></TD> <TD οnclick="javascript:sortTable('6','imagerorder6_0');"> <DIV align=center><FONT title=点击标题，进行数据排序 style="CURSOR: hand">申报时间</FONT> <IMG title="" height=1 src="/arrowdown.gif" width=1 name=imagerorder6_0> </DIV></TD> <TD οnclick="javascript:sortTable('7','imagerorder7_0');"> <DIV align=center><FONT title=点击标题，进行数据排序 style="CURSOR: hand">市级</FONT> <IMG title="" height=1 src="/arrowdown.gif" width=1 name=imagerorder7_0> </DIV></TD> <TD οnclick="javascript:sortTable('8','imagerorder8_0');"> <DIV align=center><FONT title=点击标题，进行数据排序 style="CURSOR: hand">资金合计</FONT> <IMG title="" height=1 src="/arrowdown.gif" width=1 name=imagerorder8_0> </DIV></TD></TR>
