我有一个带有 2 个数据属性的 li 元素,基本上我想首先整理出 data-arrange 属性, 这是元素
<ul>
<li data-arrange="2" data-rdays="100">John</li>
<li data-arrange="1" data-rdays="300">Paul</li>
<li data-arrange="1" data-rdays="500">Bryan</li>
<li data-arrange="3" data-rdays="240">Mark</li>
<li data-arrange="3" data-rdays="500">Victor</li>
<li data-arrange="4" data-rdays="200">Tess</li>
</ul>
所以从给定的元素它应该像这样返回
data-arrange属性值排列
1
1
2
3
3
4
然后我想根据 data-arrange 属性排列使用 data-rdays 属性从最高到最低对其进行排序,所以它看起来像这样
1 500
1 300
2 100
3 500
3 240
4 200
结果应该是这样的
Bryan
Paul
John
Victor
Mark
Tess
这是我迄今为止尝试过的:
function sort_li(a, b){
return ($(b).data('arrange')) < ($(a).data('arrange')) ? 1 : -1;
/* Other return staments that I've tried
return ($(a).data('rdays') && $(b).data('arrange')) < ($(b).data('rdays')
&& $(a).data('arrange')) ? 1 : -1;
return new Date($(a).data("date")) - new Date($(b).data("date")); */
}
有什么办法可以实现这一点吗?谢谢。
最佳答案
您可以首先对 arrange
数据进行排序,然后使用 array#sort 对
.rdays
数据进行相同 arrange
数据排序
$(function() {
$("ul li").sort((a,b) => {
return $(a).data('arrange') - $(b).data('arrange') || $(b).data('rdays') - $(a).data('rdays');
}).appendTo('ul');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
<li data-arrange="2" data-rdays="100">John</li>
<li data-arrange="1" data-rdays="300">Paul</li>
<li data-arrange="1" data-rdays="500">Bryan</li>
<li data-arrange="3" data-rdays="240">Mark</li>
<li data-arrange="3" data-rdays="500">Victor</li>
<li data-arrange="4" data-rdays="200">Tess</li>
</ul>
关于javascript - 使用 jquery sort 按两个数据属性对元素进行排序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49063119/