js表格排序

js表格排序两种插件

1.sorttable.js

sortable.js官网

使用方法：

1.官网只用方法截图：

简单翻译：

　　1.下载sorttable.js

　　2.在你网页头部中引入这个js库：<script src="./sorttable.js"></script>

　　3.给你网页表格的<table>标签添 class="sortable"

　　注：这是一个原生js库，不依赖jquery

2.简单版sortable.js

//sortable.js
/**
 * 比较函数生成器
 * 
 * @param iCol
 *            数据行数
 * @param sDataType
 *            该行的数据类型
 * @return
 */
);function generateCompareTRs(iCol, sDataType) {
    return function compareTRs(oTR1, oTR2) {
        var vValue1 = convert(oTR1.cells[iCol].firstChild.nodeValue, sDataType);
        var vValue2 = convert(oTR2.cells[iCol].firstChild.nodeValue, sDataType);
        if (vValue1 < vValue2) {
            return -1;
        } else if (vValue1 > vValue2) {
            return 1;
        } else {
            return 0;
        }
    };
}

/**
 * 处理排序的字段类型
 * 
 * @param sValue
 *            字段值 默认为字符类型即比较ASCII码
 * @param sDataType
 *            字段类型 对于date只支持格式为mm/dd/yyyy或mmmm dd,yyyy(January 12,2004)
 * @return
 */
function convert(sValue, sDataType) {
    switch (sDataType) {
        case "int":
            return parseInt(sValue);
        case "float":
            return parseFloat(sValue);
        case "date":
            return new Date(Date.parse(sValue));
        default:
            return sValue.toString();
    }
}

/**
 * 通过表头对表列进行排序
 * 
 * @param sTableID
 *            要处理的表ID<table id=''>
 * @param iCol
 *            字段列id eg: 0 1 2 3 ...
 * @param sDataType
 *            该字段数据类型 int,float,date 缺省情况下当字符串处理
 */
function sortTable(sTableID, iCol, sDataType) {
    var oTable = document.getElementById(sTableID);
    var oTBody = oTable.tBodies[0];
    var colDataRows = oTBody.rows;
    var aTRs = new Array();
    for (var i = 0; i < colDataRows.length; i++) {
        aTRs[i] = colDataRows[i];
    }
    if (oTable.sortCol == iCol) {
        aTRs.reverse();
    } else {
        aTRs.sort(generateCompareTRs(iCol, sDataType));
    }
    var oFragment = document.createDocumentFragment();
    for (var j = 0; j < aTRs.length; j++) {
        oFragment.appendChild(aTRs[j]);
    }
    oTBody.appendChild(oFragment);
    oTable.sortCol = iCol;
}

使用方法：

　　1.给你的表格<table>标签添加一个id,如 sortable

　　2.在对应的列调用 sortTable(sTableID, iCol, sDataType)方法，3个参数分别是（当前排序列表的id，当前排序的列[从0开始]，数据类型)；例如sortTable('sortable',2,'float')；

　　注：如果排序的列为空，则可能会报错