求一点击表格排序表格行的例子

[ilovegc]

点表头，表格行排序。

[cuixiping]

<script language="JavaScript">
<!--

function sortby(colIndex,ord){
var argsLen=sortby.arguments.length
if(argsLen<1){return;}
if(argsLen>1){return;}
var ci=t1.sortColIndex
var td=tbody_0.rows[0].cells[colIndex]
var datatype=td.datatype
var o = (td.order=="Desc" ? "Desc" : "Asc")
if(ci==colIndex && t1.order==o){
var o = (o=="Desc" ? "Asc" : "Desc")
}
t1.sortColIndex=colIndex
t1.order=o
var trs=tbody_1.rows
n=trs.length
var i,j
//var c=0
for(i=0;i<=n-2;i++){
for(j=i+1;j<=n-1;j++){
sort2rows(trs[i],trs[j],colIndex,o,datatype)
//c++
}
}
//alert("进行了"+c+"次比较！")
}
function sort2rows(tr1,tr2,sortColIndex,AscOrDesc,datatype){
var argsLen=sort2rows.arguments.length
if(argsLen<3){return;}
if(argsLen<5){
var datatype="str"
}else if(argsLen<4){
var AscOrDesc="Asc"
}
var ci = sortColIndex
var s1 = tr1.cells[ci].innerText
var s2 = tr2.cells[ci].innerText
switch(datatype){
case "str": //字符串比较，区分大小写
break;
case "str2": //字符串比较，不区分大小写
s1=s1.toLowerCase()
s2=s2.toLowerCase()
break;
case "num": //数字比较
s1=parseFloat(s1)
s2=parseFloat(s2)
if(isNaN(s1)){s1=Number.NEGATIVE_INFINITY}
if(isNaN(s2)){s2=Number.NEGATIVE_INFINITY}
break;
default:
break;
}
var o = (AscOrDesc=="Desc" ? -1 : 1)
if((o==-1 && s1<s2)||(o==1 && s1>s2)){
tr1.swapNode(tr2);
}
}
//-->
</script>
<TABLE id=t1 border=1 width=400>
<COL align=center>
<COL align=center>
<TBODY id=tbody_0>
<TR bgColor=buttonface style="CURSOR: default">
<TD onclick=sortby(0) width=150 order="Asc"
datatype="str2">姓名<BR>(点击这里排序)</TD>
<TD onclick=sortby(1) width=150 order="Desc"
datatype="num">年龄<BR>(点击这里排序)</TD></TR>
</TBODY>
<TBODY id=tbody_1>
<TR><TD>Alice<TD>22</TR>
<TR><TD>White<TD>27</TR>
<TR><TD>Emily<TD>23</TR>
<TR><TD>alice<TD>-22</TR>
<TR><TD>white<TD>-27</TR>
<TR><TD>emily<TD>-23</TR>
<TR><TD>安<TD>6</TR>
<TR><TD>工<TD>3</TR>
<TR><TD>仄<TD>4</TR>
</TBODY>
</TABLE>