リストボックスに動的に選択肢を追加する

ＨＴＭＬの＜ＳＥＬＥＣＴ＞タグのリストボックスに
動的に選択肢を挿入する方法です。

ＤＥＭＯ

ソース




ＤＥＭＯ





ボタンを押すたびにエントリが追加されます



ソース

では、ソースを見てみましょう。


<SCRIPT>
	function sub_on_lst()
	{
		var oOption ;
		oOption = document.createElement("OPTION");
		oOption.text  = "Test item 1";
		oOption.value = "5";
		document.frm_test.lst_test.add(oOption);
		oOption = document.createElement("OPTION");
		oOption.text  = "Test item 2";
		oOption.value = "6";
		document.frm_test.lst_test.add(oOption);
	}
</SCRIPT>

	<FORM name="frm_test">
		<INPUT type=button value="Click Me" onclick="sub_on_lst();">
		<BR><BR>
		<SELECT name="lst_test">
		</SELECT>
	</FORM>


特出すべき点は、CreateElement メソッドによって、OPTIONを
作り出して、それを add メソッドによって、SELECTIONオブジェクトに
追加している点です。


戻る