HTML Select 中的排序选项

Question

有这样的情况：

<select id="trollSelect">
    <option value="PL">Polish Troll</option>
    <option value="EN">English Troll</option>
    <option value="JP">Japanese Troll</option>
    [...] //more options created dynamically
</select>

Option values并且Option texts在 中未排序Select。是否可以在 JQuery 或 Javascript 中按字母顺序value或按text字母顺序对这些选项进行排序？

结果应该是这样的：

<select id="trollSelect">
    <option value="EN">English Troll</option>
    <option value="JP">Japanese Troll</option>
    <option value="PL">Polish Troll</option>
    [...] //more options created dynamically
</select>

Answer 1

这段代码应该可以做到。我已经根据它们的值对它们进行了排序，但这也可以用于根据文本进行排序。

$(document).ready(function() {
    var opt = $("#trollSelect option").sort(function (a,b) { return a.value.toUpperCase().localeCompare(b.value.toUpperCase()) });
    $("#trollSelect").append(opt);
});

这是同样的小提琴