jQuery sort() 没有排序答案

【问题标题】：jQuery sort() is not sortingjQuery sort() 没有排序
【发布时间】：2018-08-11 00:02:05
【问题描述】：

我想按 jQuery 对 div 中的 li 进行字母排序

此刻，发生了一些无法定义的事情。显然是无模式排序的。

这是我的 html 的 sn-p

<ul id="ui-id-1" tabindex="0" class="ui-menu ui-widget ui-widget-content ui-autocomplete ui-front">
  <li class="ui-menu-item">
    <div id="ui-id-149" tabindex="-1" class="ui-menu-item-wrapper">Great Britain</div>
  </li>
  <li class="ui-menu-item">
    <div id="ui-id-128" tabindex="-1" class="ui-menu-item-wrapper">Austria</div>
  </li>
  <li class="ui-menu-item">
    <div id="ui-id-150" tabindex="-1" class="ui-menu-item-wrapper">Nigeria</div>
  </li>
  <li class="ui-menu-item">
    <div id="ui-id-169" tabindex="-1" class="ui-menu-item-wrapper">Morocco</div>
  </li>
  <li class="ui-menu-item">
    <div id="ui-id-132" tabindex="-1" class="ui-menu-item-wrapper">Turkey</div>
  </li>
  <li class="ui-menu-item">
    <div id="ui-id-133" tabindex="-1" class="ui-menu-item-wrapper">Romania</div>
  </li>
  <li class="ui-menu-item">
    <div id="ui-id-134" tabindex="-1" class="ui-menu-item-wrapper">Belgium</div>
  </li>
  <li class="ui-menu-item">
    <div id="ui-id-135" tabindex="-1" class="ui-menu-item-wrapper">Netherlands</div>
  </li>
  <li class="ui-menu-item">
    <div id="ui-id-136" tabindex="-1" class="ui-menu-item-wrapper">Luxembourg</div>
  </li>
  ...
</ul>

js:

var $lis = $('.ui-menu-item');
var alphabeticallyOrderedLis = $lis.sort(function(a, b) {
  return $(a).find("div").text() > $(b).find("div").text();
});
$(".ui-autocomplete").html(alphabeticallyOrderedLis);

但请自行访问 fiddle 进行检查：https://jsfiddle.net/the_taeq/jwx1w729/

我真的那么笨吗？

【问题讨论】：

标签： jquery sorting

【解决方案1】：

$(a).find("div").text().localeCompare($(b).find("div").text());

您需要正确比较字符串值。字符串通常不能很好地与< 或> 配合使用。

参考。 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/localeCompare

【讨论】：

【解决方案2】：

使用这个jquery代码

$( document ).ready(function() {
    var $list = $("#ui-id-1");

  $list.children().detach().sort(function(a, b) {
    return $(a).text().localeCompare($(b).text());
  }).appendTo($list);
});

【讨论】：

【解决方案3】：

假设你在位置 0 的字符串中有空格，那么这段代码对我有用

$(a).find("div").text().trim().charAt(0).toUpperCase().localeCompare($(b).find("div").text().trim().charAt(0).toUpperCase());

【讨论】：