jQuery实现表格按列字母或数字排序..docxVIP

最近做的一个项目中需要自己写个表格排序的功能，于是就上网收集了一下，主要原理就是jQuery操作表格　jQuery代码如下：$(function () {$(#tblGrid).each(function () {var $table = $(this); //将table存储为一个jquery对象$(thead td, $table).each(function (column) {var findSortKey;if ($(this).is(.sort-alpha)) { //按字母排序findSortKey = function ($cell) {return $cell.find(sort-key).text().toUpperCase() + + $cell.text().toUpperCase();};} else if ($(this).is(.sort-numeric)) { //按数字排序findSortKey = function ($cell) {var key = parseFloat($cell.text().replace(/^[^\d.]*/, ));return isNaN(key) ? 0 : key;};}if (findSortKey) {$(this).addClass(clickable).hover(function () { $(this).addClass(hover); }, function () { $(this).removeClass(hover); }).click(function () {//反向排序状态声明var newDirection = 1;if ($(this).is(.sorted-asc)) {newDirection = -1;}var rows = $table.find(tbodytr).get(); //将数据行转换为数组$.each(rows, function (index, row) {row.sortKey = findSortKey($(row).children(td).eq(column));});rows.sort(function (a, b) {if (a.sortKey b.sortKey) return -newDirection;if (a.sortKey b.sortKey) return newDirection;return 0;});$.each(rows, function (index, row) {$table.children(tbody).append(row);row.sortKey = null;});$table.find(thead td).removeClass(sorted-asc).removeClass(sorted-desc);var $sortHead = $table.find(thead td).filter(:nth-child( + (column + 1) + ));//实现反向排序if (newDirection == 1) {$sortHead.addClass(sorted-asc);} else {$sortHead.addClass(sorted-desc);}//移除已排序的列的样式,添加样式到当前列$table.find(td).removeClass(sorted).filter(:nth-child( + (column + 1) + )).addClass(sorted);$table.trigger(repaginate);});}});});});table id=tblGridtheadtrtd style=width: 10%;员工工号/tdtd style=width: 10%;员工姓名/tdtd style=width: 15%;职务名称/tdtd class=sort-numeric style=width: 10%;得分/tdtd class=sort-alpha style=width: 10%;绩效考核等级br /（直接主管）/tdtd style=width: 25%;事例说明/tdtd class=sort-alpha style=width: 10%;绩效考核等级br /（上级主管）/tdtd style=width: 10%;绩效考核等级br /（部门主管）/td/tr/theadtbody!--#RowBegin#--tr rowindex=1td height=28px0710/tdtd张三/tdtd客服支持/tdtd100/tdtd class=director_1优秀/tdtd李四 直接主管考评信息 /tdt