在jQuery中订购<ul> / <ol>的最简单方法是什么?</ol> </ul>

时间:2008-11-20 05:18:18

标签: jquery sorting

我正在寻找一些示例代码,它将按字母顺序对HTML列表中的列表项进行排序。有人可以帮忙吗?

以下是供人们使用的示例列表:

<ul class="alphaList">
    <li>apples</li>
    <li>cats</li>
    <li>bears</li>
</ul>

3 个答案:

答案 0 :(得分:90)

var items = $('.alphaList > li').get();
items.sort(function(a,b){
  var keyA = $(a).text();
  var keyB = $(b).text();

  if (keyA < keyB) return -1;
  if (keyA > keyB) return 1;
  return 0;
});
var ul = $('.alphaList');
$.each(items, function(i, li){
  ul.append(li); /* This removes li from the old spot and moves it */
});

答案 1 :(得分:7)

对于未来的googlers,我发现这个插件非常有用。它可以选择定义非拉丁语言的字符顺序。

旧版本(依赖于jQuery)

$('.submenu > li').tsort({
    charOrder: 'abcçdefgğhıijklmnoöprsştuüvyz'
});

对于仅英文字符,无需任何选项来定义

$('.submenu > li').tsort();

当前版本(独立于jQuery)(2016年3月29日)

当前版本的tinysort现在独立于jQuery。纯JavaScript。我更新了jsfiddle用于新版本的使用。

tinysort('.submenu > li', {
    charOrder: 'abcçdefgğhıijklmnoöprsştuüvyz'
});

<强>演示 http://jsfiddle.net/ergec/EkScy/

网站 http://tinysort.sjeiti.com/

答案 2 :(得分:6)

试试这个:

var elems = $('.alphalist li').detach().sort(function (a, b) {
  return ($(a).text() < $(b).text() ? -1 
        : $(a).text() > $(b).text() ? 1 : 0);
}); 
$('.alphalist').append(elems);