所以我试图通过每个 <li>
中的子元素的 data-id 属性对无序列表进行排序.我如何定位此元素以按其值排序?
这是我当前的代码:
$("#sort_popularity").live("click", function() {
var listitems = list.children('li').get();
listitems.sort(function(a, b) {
var compA = $(a).("#subject_popularity");
var compB = $(b).("#subject_popularity");
return compA < compB;
});
$.each(listitems, function(index, item) {
list.append(item); // (List is defined elsewhere in my code)
});
});
HTML:
<a href="#" id="sort_popularity">Sort</a>
<ul>
<li><span id="popularity" data-id="10">10</li>
<li><span id="popularity" data-id="20">20</li>
<li><span id="popularity" data-id="5">5</li>
</ul>
最佳答案
// for ASC.
var lis = $('ul li');
lis.sort(function(a, b) {
return parseInt($('span', a).data('id'), 10) > parseInt( $('span', b).data('id'), 10);
});
$('ul').html(lis);
和
// for DESC.
var lis = $('ul li');
lis.sort(function(a, b) {
return parseInt( $('span', a).data('id'), 10) < parseInt( $('span', b).data('id'), 10);
});
$('ul').html(lis);
注意事项
更改 span
的 id
,多个 span
没有相同的 id
并关闭你的 span
标签(可能是拼写错误)。
关于javascript - 按子元素的数据 ID 对 li 进行排序 - jQuery,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11218043/