Jquery表格排序 -> 文本前面加数字

Question

我正在开发一个等待时间API，用于显示迪士尼乐园当前的排队时间。等待时间以字母顺序加载到表格中。

现在我使用以下代码将该表格按照最高等待时间排序，使得最长等待时间的项目排在表格顶部。这正是我想要的：

$(document).ready(function(){
var sorted = $('#mytable tbody tr').sort(function(b, a) {
  var a = $(a).find('td:last').text(), b = $(b).find('td:last').text();
  return a.localeCompare(b, false, {numeric: true})
})

$('#mytable tbody').html(sorted)
});

这很好，但是您可以在下面的图片中看到，像“已关闭”和“翻新”这样的文本值位于表格顶部，高于最高等待时间。

我该如何更改表格的顺序，以使最长等待时间位于表格顶部，并在最后显示文本值？

当前顺序，想要更改

所以我想要：

20 min.
15 min.
5 min.
Open
Closed
Refurbishment

- Dennis

Answer 1

为了按照您的要求进行排序，需要根据值是否为数字来进行不同的排序。如果两个值都是数字，则按照目前的方式进行比较。否则，如果只有一个值是数字，则将其排在前面；如果两个值都不是数字，则根据您需要的顺序（Open、Closed、Refurbishment）进行排序，可以通过查找定义排序顺序的对象中的短语来实现。

var states = {
  'Open': 0,
  'Closed': 1,
  'Refurbishment': 2
};

$(document).ready(function() {
  var sorted = $('#mytable tbody tr').sort(function(b, a) {
    var a = $(a).find('td:last').text(),
      b = $(b).find('td:last').text();
    if (!isNaN(parseInt(a))) {
      if (!isNaN(parseInt(b))) {
        // a and b both numeric
        return a.localeCompare(b, false, {
          numeric: true
        });
      } else {
        // a numeric, b not, sort b last
        return 1;
      }
    } else if (!isNaN(parseInt(b))) {
      // a not numeric, b numeric, sort a last
      return -1;
    } else {
      // a not numeric, b not numeric, sort regular
      return states[b] - states[a];
    }
  });
  $('#mytable tbody').html(sorted)
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table id="mytable">
  <tbody>
    <tr>
      <td>Challenge trails</td>
      <td>Refurbishment</td>
    </tr>
    <tr>
      <td>Camp Discovery</td>
      <td>Open</td>
    </tr>
    <tr>
      <td>Soaring</td>
      <td>120 mins</td>
    </tr>
    <tr>
      <td>Fantasia</td>
      <td>20 mins</td>
    </tr>
    <tr>
      <td>Shipwreck Shore</td>
      <td>5 mins</td>
    </tr>
    <tr>
      <td>Rex's Racer</td>
      <td>105 mins</td>
    </tr>
    <tr>
      <td>Slinky Dog</td>
      <td>Closed</td>
    </tr>
  </tbody>
</table>

- Nick

---

非常感谢你，Nick！！它起作用并帮助了我很多。这就是为什么我喜欢互联网，感谢你的帮助。 - Dennis