js 表格排序 支持 中英文 ， 可选择不排序的行

/** * <p>sortTable.js * <p>通用于指定了ID的表格进行排序 * @author heardy * @time 2010/12/31 * @version 1.0 * <p>调用代码样式： * <p>sortTableByColumn("sortTable",0,'int',1,1);//说明表格Id是sortTable 点击的是第一列 数据类型是int 第一行和最后一行不排序 * <p>sortTableByColumn("sortTable",1,'date',2,3);//说明表格Id是sortTable 点击的是第二列 数据类型是date 前两行和最后三行不排序 * <p>sortTableByColumn("sortTable",2,'cn',2,1);//说明表格Id是sortTable 点击的是第三列 数据类型是中文字符 前两行和最后一行不排序 * <p>本程序在IE6 和 Firefox 3.6.6 下 成功测试通过 其他未进行测试 *///设置隐藏排序符号spanSrc = document.createElement("<span>");spanSrc.innerHTML = "▼";// 占位用var f = this.spanSrc.cloneNode(true);// 判断是使用IE还是使用FireFoxfunction ieOrFireFox(ob) {if (ob.textContent != null)return ob.textContent;var s = ob.innerText;return s.substring(0, s.length);}// 添加排序符号function addSortSymbols(header, px) {// 添加符号if (px == "asc")f.innerHTML = "▲";elsef.innerHTML = "▼";f.style.visibility = 'visible';// 设置F样式为显示header.appendChild(f);// 挂载到header下方// header.style.textIndent = f.offsetWidth;//设置宽度,若有此项,显示时前方会有空格}// 排序 sortTableId:表的id, iCol:第几列; dataType:iCol对应的列显示数据的数据类型 ; start:指定前几排不排序 ; end:指定后几排不排序function sortTableByColumn(sortTableId, iCol, dataType, start, end) {var sortTable = document.getElementById(sortTableId);// 获取表对象var tbody = sortTable.tBodies[0];var colRows = tbody.rows;var aTrs = new Array;// var sortedHeader = sortTable.tHead.rows[0].cells[iCol];// cells表示该行(tr)的单元格(td)组var sortedHeader = sortTable.rows[0].cells[iCol]; // 若标题栏没有<thead>包围的话用此变量 使用此变量时,start至少指定为1 要不 标题也进行排序f.style.visibility = 'hidden';// 开始设置排序符号位隐藏var unSortRows = new Array;//记录不需要排序的行var j = 0;// 记录不排序的下标// 将得到的列放入数组，备用for ( var i = 0; i < colRows.length; i++) {if (i >= start && i <= colRows.length - end - 1) aTrs[i - start] = colRows[i];//需要排序的行elseunSortRows[j++] = colRows[i];//不需要排序的行}// 判断上一次排列的列和现在需要排列的是否同一个。if (sortTable.sortCol == iCol) {//判断时候排序过if (sortTable.sortOrder == "desc") {//实现递增 递减 交替排序aTrs.sort(compareEle(iCol, dataType, 'asc'));sortTable.sortOrder = "asc";} else {aTrs.sort(compareEle(iCol, dataType, 'desc'));sortTable.sortOrder = "desc";}} else {//首次点击调用此方法// 如果不是同一列，使用数组的sort方法，传进排序函数aTrs.sort(compareEle(iCol, dataType, 'asc')); // 第一次按递增排序sortTable.sortOrder = "asc";//记录此次排序}// 当数据排序介绍之后,由于sortTable.sortOrder设置了排序格式,所以直接调用sortTable.sortOrder进行设置显示的符号addSortSymbols(sortedHeader, sortTable.sortOrder);// 记录最后一次排序的列索引sortTable.sortCol = iCol;var oFragment = document.createDocumentFragment();j = 0;//首先挂载不排序的头记录if (start != 0)for ( var i = 0; i < start; i++) {oFragment.appendChild(unSortRows[j++]);}//其次挂载排序后的行记录for ( var i = 0; i < aTrs.length; i++) {oFragment.appendChild(aTrs[i]);}//再则挂载不排序的尾记录if (end != 0)for ( var i = 0; i < end; i++) {oFragment.appendChild(unSortRows[j++]);}//擦除挂载在tbody下的数据，将新数据挂载上去tbody.appendChild(oFragment);}// 将列的类型转化成相应的可以排列的数据类型function convert(sValue, dataType, sortDerection) {switch (dataType) {case "int":if (sValue.length <= 0) {sValue = "-999999999";//设置整型空字符默认为此数据，假设所有的数据大于此数据，说明空字符是最小的数据}return parseInt(sValue, 10);case "float":return parseFloat(sValue);case "date":return new Date(Date.parse(sValue));default:return sValue.toString().toLowerCase();}}// 排序函数，iCol表示列索引，dataType表示该列的数据类型function compareEle(iCol, dataType, sortDerection) {return function(oTR1, oTR2) {// oTR1 oTR2 分别代表两个相邻的行var returnResult = 0;if (dataType == "cn") {//假若是中文排序 直接调用此方法进行排序returnResult = (ieOrFireFox(oTR1.cells[iCol])).localeCompare(ieOrFireFox(oTR2.cells[iCol]))} else {var vValue1 = convert(ieOrFireFox(oTR1.cells[iCol]), dataType,sortDerection);var vValue2 = convert(ieOrFireFox(oTR2.cells[iCol]), dataType,sortDerection);if (vValue1 < vValue2) {returnResult = -1;} else if (vValue1 > vValue2) {returnResult = 1;} else {returnResult = 0;}}if (sortDerection == "desc") {return -returnResult;} else {return returnResult;}};}

 里面部分方法是从网上好友那得到的，本人对里面的所有方法进行了注释，也添加自己的方法，进行支持中文排序，点击排序列后，显示排序符号，对不需要进行排序的行指定行数。

 

希望有人能继续完善！

 

转载请写明出处，谢谢！