如何按词法顺序对选择选项排序

how to sort select option in lexical order

本文关键字:选择 选项 排序 顺序 何按 词法      更新时间:2023-09-26

我有一个选择选项

<select>
<option>aaa</option>
<option>ccc</option>
<option>ddd</option>
<option>bbb</option>
</select>

如何排序。因此输出将

aaa
bbb
ccc
ddd
在一次面试中有人问我这个问题知道了就回答

您可以使用使用JavaScript排序方法。它按词汇顺序对元素进行排序。因此,您可以根据排序函数的结果设置select元素的innerHTML。

在这里阅读更多关于排序函数的信息

试题:

$("select").html($('select option').sort(function (x, y) {
    return $(x).text() < $(y).text() ? -1 : 1;
}))
演示

添加id

<select id='myselect'>
<option>aaa</option>
<option>ccc</option>
<option>ddd</option>
<option>bbb</option>
</select>

获取数组中的所有选项,对其排序,然后更改select

的值
var array = new Array();
$("#myselect option").each(function() { array.push($(this).text()) });
array.sort();
$("#myselect option").each(function(index,elem) { $(this).html(array[index]) });

工作小提琴

$('#sort').click(function () {
$('select').each(function () {
   var options = $(this).children('option');
    options.sort(function (optionA, optionB) {
        return optionA.value.localeCompare(optionB.value);
    });
    $(this).empty().append(options);
});
});