如何使用jQuery按字母顺序对列表进行排序？

javascript dom jquery sorting

2022-08-30 00:39:29

我在这里有点超出我的深度，我希望这实际上是可能的。

我希望能够调用一个函数，该函数将按字母顺序对列表中的所有项目进行排序。

我一直在查看jQuery UI进行排序，但似乎并非如此。有什么想法吗？

答案 1

像这样：

var mylist = $('#myUL');
var listitems = mylist.children('li').get();
listitems.sort(function(a, b) {
   return $(a).text().toUpperCase().localeCompare($(b).text().toUpperCase());
})
$.each(listitems, function(idx, itm) { mylist.append(itm); });

从此页面：http://www.onemoretake.com/2009/02/25/sorting-elements-with-jquery/

上面的代码将使用id“myUL”对无序列表进行排序。

或者你可以使用像TinySort这样的插件。https://github.com/Sjeiti/TinySort

答案 2

你不需要jQuery来做到这一点...

function sortUnorderedList(ul, sortDescending) {
  if(typeof ul == "string")
    ul = document.getElementById(ul);

  // Idiot-proof, remove if you want
  if(!ul) {
    alert("The UL object is null!");
    return;
  }

  // Get the list items and setup an array for sorting
  var lis = ul.getElementsByTagName("LI");
  var vals = [];

  // Populate the array
  for(var i = 0, l = lis.length; i < l; i++)
    vals.push(lis[i].innerHTML);

  // Sort it
  vals.sort();

  // Sometimes you gotta DESC
  if(sortDescending)
    vals.reverse();

  // Change the list on the page
  for(var i = 0, l = lis.length; i < l; i++)
    lis[i].innerHTML = vals[i];
}

易于使用...

sortUnorderedList("ID_OF_LIST");

现场演示→