1. ホーム
  2. javascript

[解決済み] Html SelectのOptionsを、現在選択されている項目を保持したまま、値でソートする最も効率的な方法は何ですか?

2023-05-16 11:10:44

質問

jQueryを持っていますが、組み込みのソートヘルパーがあるかどうかわかりません。私は各アイテムの2次元配列を作成することができました。 text , value そして selected プロパティがありますが、javascript に組み込まれている Array.sort() は正しく動作しないと思います。

どのように解決するのですか?

オプションを一時的な配列に展開し、ソートした後、リストを再構築してください。

var my_options = $("#my_select option");
var selected = $("#my_select").val();

my_options.sort(function(a,b) {
    if (a.text > b.text) return 1;
    if (a.text < b.text) return -1;
    return 0
})

$("#my_select").empty().append( my_options );
$("#my_select").val(selected);

Mozilla のソートに関する文書 (特に compareFunction) と ウィキペディアのソートアルゴリズムページ が関連しています。

大文字小文字を区別しないソートを行いたい場合は、以下のように texttext.toLowerCase()

上に示したソート関数は、ソートの方法を示しています。英語以外の言語を正確にソートすることは複雑です ( unicode照合順序アルゴリズム ). 使用方法 ロケール比較 を使うのは良い解決策です。

my_options.sort(function(a,b) {
    return a.text.localeCompare(b.text);
});