☰

jQuery を使用して DropDownList にオプションを追加するにはどうすればいいですか? 質問する

tag-icon • tag-icon jquery user-interface drop-down-menu
jQuery を使用して DropDownList にオプションを追加するにはどうすればいいですか? 質問する

質問にあるように、jQuery を使用して DropDownList に新しいオプションを追加するにはどうすればよいですか?

ありがとう

ベストアンサー1

追加のプラグインを使用せずに、

var myOptions = {
    val1 : 'text1',
    val2 : 'text2'
};
var mySelect = $('#mySelect');
$.each(myOptions, function(val, text) {
    mySelect.append(
        $('<option></option>').val(val).html(text)
    );
});

選択肢がたくさんある場合や、このコードを頻繁に実行する必要がある場合は、ドキュメントフラグメントDOM を不必要に何度も変更する代わりに、オプションがほんの一握りしかないので、それだけの価値はないと思います。

- - - - - - - - - - - - - - - - 追加した - - - - - - - - - - - - - - - -

DocumentFragment速度向上には良いオプションですが、document.createElement('option')IE6 と IE7 ではサポートされていないため、これを使用してオプション要素を作成することはできません。

できることは、新しい選択要素を作成し、すべてのオプションを追加することです。ループが終了したら、それを実際の DOM オブジェクトに追加します。

var myOptions = {
    val1 : 'text1',
    val2 : 'text2'
};
var _select = $('<select>');
$.each(myOptions, function(val, text) {
    _select.append(
            $('<option></option>').val(val).html(text)
        );
});
$('#mySelect').append(_select.html());

この方法では、DOM を 1 回だけ変更します。

おすすめ記事