給出以下列表<ul class="listitems"> <li data-position="1">Item 1</li> <li data-position="2">Item 2</li> <li data-position="3">Item 3</li> <li data-position="4">Item 4</li></ul>頁面上有一些功能，可以使這些項目改變位置。例如，他們可能會進入以下狀態(tài)（僅作為示例，訂單可以是任何東西）：<ul class="listitems"> <li data-position="3">Item 3</li> <li data-position="2">Item 2</li> <li data-position="1">Item 1</li> <li data-position="4">Item 4</li></ul>我正在尋找一個小的功能來重置訂單。到目前為止，我有以下內(nèi)容：function setPositions(){ $( '.listitems li' ).each(function() { var position = $(this).data('position'); $(this).siblings().eq(position+1).after(this); });}但是它不能正常工作。我究竟做錯了什么？附加條件是列表的順序可能沒有更改，因此該功能也必須在這種情況下起作用。
3 回答
偶然的你
TA貢獻1841條經(jīng)驗 獲得超3個贊
擴展Rohan的答案，如果您希望此方法適用于多個列表而不只是一個列表，則可以使用以下方法：
HTML：
<ul class="listitems autosort">
<li data-position="3">Item 3</li>
<li data-position="2">Item 2</li>
<li data-position="1">Item 1</li>
<li data-position="4">Item 4</li>
</ul>
<ul class="listitems autosort">
<li data-position="5">Item 5</li>
<li data-position="6">Item 6</li>
<li data-position="3">Item 3</li>
<li data-position="4">Item 4</li>
</ul>
Javascript：
$(".listitems.autosort").each(function(){
$(this).html($(this).children('li').sort(function(a, b){
return ($(b).data('position')) < ($(a).data('position')) ? 1 : -1;
}));
});
這樣，您可以根據(jù)需要添加任意數(shù)量的列表，并對它們進行排序，只需設置類自動排序即可。
- 3 回答
- 0 關注
- 422 瀏覽
添加回答
舉報
0/150
提交
取消