javascript - 使用 optgroups 对下拉列表进行排序

Question

我有一个下拉菜单，其中包含很多我希望按字母顺序排列的项目，如果它有所不同，下拉菜单使用 optgroups。

假设我有这样的东西:

<optgroup label="Fruits">
<option>Banana</option>
<option>Apple</option>
<option>Orange</option>
<option>Avocado</option>
</optgroup>

我如何才能让它按字母顺序显示每个 optgroup？在上面的示例中，它的顺序是苹果、鳄梨、香蕉、橙子。

Answer 1

您可以使用sort()

$('optgroup[label="Fruits"] option').sort(function(a, b) {
  return $(a).text() > $(b).text();
}).appendTo('optgroup[label="Fruits"]');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<optgroup label="Fruits">
  <option>Banana</option>
  <option>Apple</option>
  <option>Orange</option>
  <option>Avocado</option>
</optgroup>