用Javascript进行简单的Table点击排序.docx

用Javascript进行简单的Table点击排序

用Javascript进行简单的Table点击排序用Javascript进行简单的`Table点击排序本文实例讲述了JavaScript实现表格点击排序的方法。分享给大家供大家参考。具体分析如下：这里实现基于JS的表格点击排序效果，可以根据表格内的数据大小自动按顺序排列，股票网站常会见到这种功能。TABLE{BORDER-RIGHT:#0000002pxsolid;BORDER-TOP:#0000002pxsolid;BORDER-LEFT:#0000002pxsolid;BORDER-BOTTOM:#0000002pxsolid;border-spacing:0px;cell-spacing:0px}TD{PADDING-RIGHT:0.5em;PADDING-LEFT:0.5em;FONT-SIZE:10pt;PADDING-BOTTOM:2px;PADDING-TOP:2px;FONT-FAMILY:Arial,Helvetica,sans-serif;WHITE-SPACE:nowrap}TH{PADDING-RIGHT:0.5em;PADDING-LEFT:0.5em;FONT-SIZE:10pt;PADDING-BOTTOM:2px;PADDING-TOP:2px;FONT-FAMILY:Arial,Helvetica,sans-serif;WHITE-SPACE:nowrap}TD.numeric{TEXT-ALIGN:right}TH{BACKGROUND-COLOR:#c0c0c0}TH.mainHeader{COLOR:#ffffff;BACKGROUND-COLOR:#808080;TEXT-ALIGN:left}THA{COLOR:#000080;TEXT-DECORATION:none}THA:visited{COLOR:#000080}THA:active{COLOR:#800000;TEXT-DECORATION:underline}THA:hover{COLOR:#800000;TEXT-DECORATION:underline}TR.alternateRow{BACKGROUND-COLOR:#e0e0e0}TD.sortedColumn{BACKGROUND-COLOR:#f0f0f0}TH.sortedColumn{BACKGROUND-COLOR:#b0b0b0}TR.alternateRowTD.sortedColumn{BACKGROUND-COLOR:#d0d0d0}functionsortTable(id,col,rev){vartblEl=document.getElementById(id);if(tblEl.reverseSort==null){tblEl.reverseSort=newArray();tblEl.lastColumn=1;}if(tblEl.reverseSort[col]==null)tblEl.reverseSort[col]=rev;if(col==tblEl.lastColumn)tblEl.reverseSort[col]=!tblEl.reverseSort[col];tblEl.lastColumn=col;varoldDsply=tblEl.style.display;tblEl.style.display="none";vartmpEl;vari,j;varminVal,minIdx;vartestVal;varcmp;for(i=0;i<tblEl.rows.length-1;i++){minIdx=i;minVal=getTextValue(tblEl.rows[i].cells[col]);for(j=i+1;j<tblEl.rows.length;j++){testVal=getTextValue(tblEl.rows[j].cells[col]);cmp=compareValues(minVal,testVal);if(tblEl.reverseSort[col])cmp=-cmp;if(cmp==0&&col!=1)cmp=compareValues(getTextValue(tblEl.rows[minIdx].cells[1]),getTextValue(tblEl.rows[j].cells[1]));if(cmp>0){minIdx=j;minVal=testVal;}}if(minIdx>i){tmpEl=tblEl.removeChild(tblEl.rows[minIdx]);tblEl.Before