やりたいこと
javascriptを使ってドロップダウンリスト(セレクトボックス)の内容を動的に変更する事を実現したい。
詳しくは、1つ目のDDLで分類を選択して、その分類によって項目を動的に帰る事やりたい。
こういう内容って調べにくいよね…
HTML
<body bgcolor onLoad=”functionName()”>
<form name=”formName” method=”post” action=”./pathToProgramFile”><select name = “selectName1″ onChange=”functionName()”>
<option value = “1”>選択肢1</option>
<option value = “2”>選択肢2</option>
<option value = “3”>選択肢3</option>
</select>
<!–（上記選択肢の項目で変化）–>
<select name = “selectName2”>
</select>
</body>
JS
<script type = “text/javascript“>
<!–
function functionName()
{
var select1 = document.forms.formName.selectName1; //変数select1を宣言
var select2 = document.forms.formName.selectName2; //変数select2を宣言select2.options.length = 0;
if (select1.options[select1.selectedIndex].value == “1”)
{
select2.options[0] = new Option(“選択肢1-1”);
select2.options[1] = new Option(“選択肢1-2”);
select2.options[2] = new Option(“選択肢1-3”);
}else if (select1.options[select1.selectedIndex].value == “2”)
{
select2.options[0] = new Option(“選択肢2-1”);
select2.options[1] = new Option(“選択肢2-2”);
select2.options[2] = new Option(“選択肢2-3”);
select2.options[3] = new Option(“選択肢2-4”);
}else if (select1.options[select1.selectedIndex].value == “3”)
{
select2.options[0] = new Option(“選択肢3-1”);
select2.options[1] = new Option(“選択肢3-2”);
}
}//–>
</script>
