jQuery排序列表基于两个值和一个条件

Question

我有以下HTML

<ul class="aa-checkbox-list aa-tick_group_test-list">
<li data-aa-position="1" data-aa-checked="1" data-aa-name="B"><label>
<input class="custom-control-input" name="some_tick" type="checkbox">
</label></li>

<li data-aa-position="2" data-aa-checked="1" data-aa-name="A"><label>
<input class="custom-control-input" name="some_tick2" type="checkbox">
</label></li>

<li data-aa-position="3" data-aa-checked="0" data-aa-name="D"><label>
<input class="custom-control-input" name="some_tick4" type="checkbox">
</label></li>

<li data-aa-position="4" data-aa-checked="0" data-aa-name="C"><label>
<input class="custom-control-input" name="some_tick3" type="checkbox">
</label></li>
</ul>

和下面的jQuery:

function tick_group_test__sort(){
$(".aa-tick_group_test-list li").sort(sort_li).appendTo('.aa-tick_group_test-list');
function sort_li(a, b) {
var x = ($(a).data('aa-checked') < $(b).data('aa-checked')) ? -1 : ($(a).data('aa-checked') > $(b).data('aa-checked')) ? 0 : 1;
return x;
}
};

我首先尝试根据降序中的"aa已检查"来排序列表，因此包含已检查输入的元素位于的顶部

然后，对于选中的(1(，按字母顺序排序，对于未选中的(0(，按其"aa位置"排序

我试了几个小时，但一辈子都想不出来

Answer 1

您正在寻找这个sort回调函数：

function sort_li(a, b) {
return $(b).data('aa-checked') - $(a).data('aa-checked')
|| ($(a).data('aa-checked') 
? $(a).data('aa-name').localeCompare($(b).data('aa-name'))
: $(a).data('aa-position') - $(b).data('aa-position')
);
}