[英]Using jquery, how do you reorder rows in a table based on a TR attribute?
我有一个表格,其行类似于以下内容。 这些行通过jquery调用不时更新。 使用jquery,我将如何根据myAttribute值构造一个重新排序这些表行的函数,将最高的myAttribute值行放在顶部,将myAttribute值最低的行放在底部? 表中最多可以有100行。
<tr id='1' class='playerRow' myAttribute=5>
<td> One</td>
<td> Two</td>
</tr>
<tr id='2' class='playerRow' myAttribute=6>
<td> One</td>
<td> Two</td>
</tr>
<table>
<tr id='1' class='playerRow' myAttribute='1'>
<td> One1</td>
<td> Two1</td>
</tr>
<tr id='2' class='playerRow' myAttribute='2'>
<td> One2</td>
<td> Two2</td>
</tr>
</table>
JQuery的
var $table=$('table');
var rows = $table.find('tr').get();
rows.sort(function(a, b) {
var keyA = $(a).attr('myAttribute');
var keyB = $(b).attr('myAttribute');
if (keyA < keyB) return 1;
if (keyA > keyB) return -1;
return 0;
});
$.each(rows, function(index, row) {
$table.children('tbody').append(row);
});
谢谢,凯。 我在保持清晰度的同时提炼了一些代码。 通常,您不希望对thead
或tfooter
部件进行排序。 因此,仅仅定位tbody
的<tr>
元素可能很方便(尽管这不是Chris的原始问题):
var tb = $('tbody');
var rows = tb.find('tr');
rows.sort(function(a, b) {
var keyA = $(a).attr('myAttribute');
var keyB = $(b).attr('myAttribute');
return keyA - keyB;
});
$.each(rows, function(index, row) {
tb.append(row);
});
要按降序排序,只需按如下方式反转返回行:
return keyB - keyA;
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.