jQuery的排序，項目

Question

的變化序列是否有可能重新排序在排序列表中的項目，而不拖動？ 例如，如果我有一個項目的名單，說1,2,3，我點擊一個鏈接（一個按鈕 - 不管），而現在的名單是3,1,2。 也許我不應該爲此使用「排序」？

Answer 1

假設你有下面的HTML：

function shuffle(){ 
    var myList = $('ul'); //Fetch the list. 
    var listItems = myList.children('li'); //Extract all listItems from it. 
    listItems.sort(function(a,b){ //This function sorts the items. 
     var compA = $(a).text().toUpperCase(); 
     var compB = $(b).text().toUpperCase(); 
     return (compA < compB) ? -1 : 1; //return a -1 or 1 depending upon specific condition. 
    }); 
    $(myList).append(listItems); 
} 

你可以使用任何簡單的按鈕像調用函數：

<ul id="sortable" class="ui-sortable"> 


    <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 3</li> 
    <li class="ui-state-default" style=""><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 2</li><li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 4</li><li class="ui-state-default" style=""><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 1</li> 
    <li class="ui-state-default" style=""><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 7</li><li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 5</li> 
    <li class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>Item 6</li> 

</ul> 

你可以通過調用下面的函數重新排序，而不拖放列表項：

<button onclick="shuffle();">Reorder</button> 

You can see a sample implementation here.