[p]自写的js表格排序，目前仅支持数字排序，其他的可以扩展sort和配置来实现，并且目前只支持单行表头，欢迎一起交流。 [/p]
[code]
<script type="text/javascript">
var tableSort = {};
(function() {
var oTable = {};
var cellStatus = {};
var sortCells = {};
var limit = {};
var $ = function(id) {
return document.getElementById(id);
}
var objKeyExists = function(key, search) {
if (typeof key != 'number' && typeof key != 'string') {
return false;
}
for (k in search) {
if (k == key) {
return true;
}
}
return false;
}
var _addEvent = function(tableId, cellId) {
oTable[tableId].rows[0].cells[cellId].onclick = function() {
tableSort.sort(tableId, cellId);
}
}
var _addStyle = function(tableId, cellId) {
oTable[tableId].rows[0].cells[cellId].style.cursor = 'pointer';
}
var _addTitle = function(tableId, cellId) {
oTable[tableId].rows[0].cells[cellId].title = '点击排序';
}
var _sortTable = function(tableId, cellId) {
var rows = oTable[tableId].tBodies[0].rows;
var _rows = [];
for (var i = 1; i < rows.length; i++) {
_rows.push(rows[i]);
}
var status = -1;
if (objKeyExists(cellId, cellStatus[tableId])) {
status = 0 - cellStatus[tableId][cellId];
}
cellStatus[tableId][cellId] = status;
if (status == 1) {
oTable[tableId].rows[0].cells[cellId].innerHTML += ' 5';
_rows.sort((function(id){
return function(a, b) {
return _sort(a, b, id);
}
}(cellId)));
} else {
oTable[tableId].rows[0].cells[cellId].innerHTML += ' 6';
_rows.sort((function(id){
return function(a, b) {
return _rsort(a, b, id);
}
}(cellId)));
}
var oFragment = document.createDocumentFragment();
for (var i = 0; i < _rows.length; i++) {
_rows[i].className = i % 2 ? 'tr' : 'tr_spec';
_rows[i].cells[0].className = i % 2 ? 'td_spec2' : 'td_spec1';
if (limit[tableId] > 0) {
if (i >= limit[tableId]) {
_rows[i].style.display = 'none';
} else {
_rows[i].style.display = '';
}
}
oFragment.appendChild(_rows[i]);
}
oTable[tableId].tBodies[0].appendChild(oFragment);
}
var _cleanStatus = function(tableId, cellId) {
for(var i = 0; i < sortCells[tableId].length; i++) {
oTable[tableId].rows[0].cells[sortCells[tableId][i]].innerHTML = oTable[tableId].rows[0].cells[sortCells[tableId][i]].innerHTML.replace(/ [56]<\/span>$/ig, '');
}
}
var _sort = function(a, b, id) {
var param1 = a.cells[id].innerText;
var param2 = b.cells[id].innerText;
param1 = param1.replace(/[^\d.-]/g, '');
param2 = param2.replace(/[^\d.-]/g, '');
if (param1 == '-' ││ param1 == '') {
return 1;
}
if (param2 == '-' ││ param2 == '') {
return -1;
}
//如果两个参数均为字符串类型
if (isNaN(param1) && isNaN(param2)){
return param1.localeCompare(param2);
}
//如果参数1为数字，参数2为字符串
if (!isNaN(param1) && isNaN(param2)){
return -1;
}
//如果参数1为字符串，参数2为数字
if (isNaN(param1) && !isNaN(param2)){
return 1;
}
//如果两个参数均为数字
if (!isNaN(param1) && !isNaN(param2)){
if (Number(param1) > Number(param2)) {
return 1;
}
if (Number(param1) == Number(param2)) {
return 0;
}
if (Number(param1) < Number(param2)) {
return -1;
}
}
//return a.cells[id].innerText - b.cells[id].innerText;
}
var _rsort = function(a, b, id) {
var param1 = b.cells[id].innerText;
var param2 = a.cells[id].innerText;
param1 = param1.replace(/[^\d.-]/g, '');
param2 = param2.replace(/[^\d.-]/g, '');
if (param1 == '-' ││ param1 == '') {
return -1;
}
if (param2 == '-' ││ param2 == '') {
return 1;
}
//如果两个参数均为字符串类型
if (isNaN(param1) && isNaN(param2)){
return param1.localeCompare(param2);
}
//如果参数1为数字，参数2为字符串
if (!isNaN(param1) && isNaN(param2)){
return -1;
}
//如果参数1为字符串，参数2为数字
if (isNaN(param1) && !isNaN(param2)){
return 1;
}
//如果两个参数均为数字
if (!isNaN(param1) && !isNaN(param2)){
if (Number(param1) > Number(param2)) {
return 1;
}
if (Number(param1) == Number(param2)) {
return 0;
}
if (Number(param1) < Number(param2)) {
return -1;
}
}
//return b.cells[id].innerText - a.cells[id].innerText;
}
tableSort = {
init : function(tableId, cells, rows) {
oTable[tableId] = $(tableId);
sortCells[tableId] = cells;
cellStatus[tableId] = {};
limit[tableId] = rows ? rows : 0;
for (var i = 0; i < cells.length; i++) {
_addEvent(tableId, cells[i]);
_addStyle(tableId, cells[i]);
_addTitle(tableId, cells[i]);
}
if (rows > 0) {
for (var i = 1; i < $(tableId).rows.length; i++) {
if (i > rows) {
$(tableId).rows[i].style.display = 'none';
}
}
}
},
sort : function(tableId, cellId) {
_cleanStatus(tableId, cellId);
_sortTable(tableId, cellId);
}
}
})();
</script>

第一列	第二列	第三列	第四列	第五列
1	4	-0.1	2009-01-01	-
2	3	-0.3	2008-01-01	-
3	2	4	2008-03-01	-
4	1	-0.1	2009-02-01	-

第一列	第二列	第三列	第四列	第五列
1	4	-0.1	2009-01-01	-
2	3	-0.3	2008-01-01	-
3	2	4	2008-03-01	-
4	1	-0.1	2009-02-01	-

<script type="text/javascript">
tableSort.init('t1', [0, 1, 2, 3]);
tableSort.init('t2', [0, 1, 2, 3], 2);
</script>[/code]

该文章在 2010/3/8 1:30:39 编辑过