====== Append select option using jquery ======
jqueryを利用し、動的にoptionを作成する方法を紹介する。
まずはデモから見てみよう。
===== Test Page =====
===== code snippet =====
function replace(){
var options = newOptions = {
'red' : 'Red',
'blue' : 'Blue',
'green' : 'Green',
'yellow' : 'Yellow'
};
$("#example option").remove();
$.each(options, function(key, val){
$("#example").append($("").val(key).text(val));
});
$("#example").val("green");
}
===== access selected value =====
因みに、選択された項目を取得する方法を紹介する。
デモを見てみる。
コードの一部を次に示す。
$("#example1").val();
$("#example1 :selected").text();
$("#example1").get(0).selectedIndex
===== reference =====
- [[http://www.electrictoolbox.com/jquery-add-option-select-jquery/|Add a new option to a select with jQuery]]
- [[http://d.hatena.ne.jp/x6x6/20080318/1205817536|jQueryでoption要素を追加した際の諸問題]]
- [[http://www.c-sharpcorner.com/blogs/BlogDetail.aspx?BlogId=1214|JQuery Tutorial:3 ways to access the selection in an HTML drop down list box]]
~~DISCUSSION~~