jsp+js实现可排序表格.docx

1、jsp+js实现可排序表格jsp+js实现可排序表格首先，定义一个js: tableSort.js: function sort(tableId, sortColumn,nodeType) var table = document.getElementById(;theTable;); var tableBody = table.tBodies0; var tableRows = tableBody.rows; var rowArray = new Array(); for (var i = 0; i ; tableRows.length; i+) rowArrayi = tableRowsi

2、; if (table.sortColumn = sortColumn) rowArray.reverse(); else rowArray.sort(generateCompareTR(sortColumn, nodeType); var tbodyFragment = document.createDocumentFragment(); for (var i = 0; i ; rowArray.length; i+) tbodyFragment.appendChild(rowArrayi); tableBody.appendChild(tbodyFragment); table.sortC

3、olumn = sortColumn; function generateCompareTR(sortColumn, nodeType) return function compareTR(trLeft, trRight) var leftValue = convert(trLeft.cellssortColumn.firstChild.nodeValue, nodeType); var rightValue = convert(trRight.cellssortColumn.firstChild.nodeValue, nodeType); if (leftValue ; rightValue

4、) return 1; else return 0; ; function convert(value, dataType) switch (dataType) case ;int;: return parseInt(value); case ;float;: return parseFloat(value); case ;date;: return new Date(Date.parse(value); default: return value.toString(); 然后是使用: ; ; ; ; ; ;base href=; ;My JSP tabel.jsp starting page

5、; ; ; ; ; ; ;!- ; -; ; ; ; ; ; ; ; 标题1 ; ; 标题2 ; ; 标题3 ; ; 标题4 ; ; 标题5 ; ; 标题6 ; ; 标题7 ; ; ; ; ; ; 1 ; ; 2 ; ; 3 ; ; 4 ; ; 5 ; ; 6 ; ; 7 ; ; ; ; 2 ; ; 3 ; ; 4 ; ; 5 ; ; 6 ; ; 7 ; ; 1 ; ; ; ; 3 ; ; 4 ; ; 5 ; ; 6 ; ; 7 ; ; 1 ; ; 2 ; ; ; ; 4 ; ; 5 ; ; 6 ; ; 7 ; ; 1 ; ; 2 ; ; 3 ; ; ; ; 5 ; ; 6 ; ; 7 ; ; 1 ; ; 2 ; ; 3 ; ; 4 ; ; ; ; 6 ; ; 7 ; ; 1 ; ; 2 ; ; 3 ; ; 4 ; ; 5 ; ; ; ; ; ; 之后就可以看到效果了。