Jquery排序多个Tbody
我有这样一张桌子:
Department Quantity Data 100 DTP 20 VTP 30 RTP 50 Testing 100 QTP 20 ATP 30 CTP 50
当我点击department标题时, tr
内部的数据和测试应该被排序。 但数据和测试TH
应该保持不变。
我不想使用任何jQuery插件。 请共享代码来完成此任务。
这是一个快速实现。 希望你会改进它,它将符合你的需求:
var $table = $('table'), $th = $table.find('thead th'), $tbody = $table.find('tbody'); $th.on('click', function() { $th.removeClass(); var index = this.cellIndex, sortType = $(this).data('sort'), sortDir = $(this).data('dir') || 'asc'; $tbody.each(function() { $(this).find('tr').slice(1).sort(function(a, b) { var aText = $(a).find('td:eq(' + index + ')').text(), bText = $(b).find('td:eq(' + index + ')').text(); if (sortDir == 'desc') { temp = aText; aText = bText; bText = temp; } if (sortType == 'string') { return aText.localeCompare(bText); } else { return +aText - +bText; } }) .appendTo(this); }); $(this).data('dir', sortDir == 'asc' ? 'desc' : 'asc'); $(this).removeClass().addClass('sort-' + sortDir); });