Question

我使用jQuery UI创建多个互连的可排序列表

html：

  <div class="ulContainer">
    <div class="liHdr">Unassigned</div>
    <div class="ulWraper">
      <ul class="connectedSortableUl un ui-sortable">
        <li class="ui-state-default" style="">Frank Smith
          <input type="hidden" class="rowName" value="frank.smith">
          <input type="hidden" class="rowEmail" value="frank.smith@email.com">
          <input type="hidden" class="rowId" value="8VNe0ZT1v0">
          <input type="hidden" class="rowTeam" value="">
          <div class="panel-options" style="float:right;"><a href="#" class="sm"><i class="entypo-pencil"></i></a></div>
        </li>
      </ul>
    </div>
  </div>

等......还有几个相同的

jQuery：

// create the sortable ui
$(".connectedSortableUl").sortable({
    connectWith: ".connectedSortableUl",
    placeholder: "ui-state-highlight",
    create: function(event, ui) {
        sort();
    }
});


// custom sort function to sort our sortable lists
function sort() {
    var sortableLists = $('.connectedSortableUl');
    $(sortableLists).each(function(index, element) {

        var listitems = $('li', element);

        listitems.sort(function(a, b) {
            var seeA = $(a).text().toUpperCase(); //just to see what's going on
            var seeB = $(b).text().toUpperCase(); //just to see what's going on
            return ($(a).text().toUpperCase() > $(b).text().toUpperCase())
        });
        $(element).append(listitems);
    });

}

我希望这个函数能够按字母顺序对每个列表进行排序顶部和Z底部
使用短列表，13个或更少的项目，此功能按预期工作。
但是，如果列表中包含14个或更多项，则会出现故障并且列表现在按预期更长时间排序。

为什么逻辑会因超过13个列表项而崩溃，我该怎么做才能解决它或以其他方式达到预期效果？

jsFiddle example

Answer 1

将两个字符串与>进行比较会返回一个布尔值，但sort需要一个数字。与localeCompare比较：

listitems.sort(function (a, b) {
  var ta = $(a).text().toUpperCase();
  var tb = $(b).text().toUpperCase();
  return ta.localeCompare(tb);
});

按字母顺序对可排序列表中的元素排序超过13项

1 个答案: