複数のセレクトボックスの値から別のセレクトボックス

解決済

質問者：hage_1000
質問日時：2014/12/19 22:20
回答数：1件

この度はお世話になります。
複数（４個）のselectboxからselectboxの値の組み合わせによって、別のselectbox（１個）の選択肢を変えたいのですが、どなたか助けていただけませんでしょうか？

動作のイメージは以下の通りです。

selectboxAの選択肢：1,2,3,4,5,
selectboxBの選択肢：あ,い,う,え,お,
selectboxCの選択肢：ア,イ,ウ,エ,オ,
selectboxDの選択肢：a,i,u,e,o,

上記の操作で、
selectboxA に1 selectboxB にい selectboxCにウ selectboxDに e　と
selectboxA に5 selectboxB にえ selectboxCにウ selectboxDに i の
組み合わせが選択されたときのみ、

selectbox E の選択肢に　あいうえお,かきくけこ,さしすせそ,が表示され、

それ以外のselectbox A～Dの選択肢の組み合わせの時はすべて、
たちつてと,なにぬねの,はひふへほ, の選択肢が表示されます。

各selectボックスの選択肢は、選択肢の数により増減します。
また選択肢Ａには数字を使ってますが、すべて文字列として扱いたいです。

ネット上でjavascript のサンプルプログラム等も見て、色々と試してみたのですが、
なかなかハードルが高く困っております。

当方素人。任意の集まりで使います。何卒よろしくお願い致します。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

回答 (1件)

ベストアンサー優先
最新から表示
回答順に表示

No.1ベストアンサー

回答者： Yoshi_F
回答日時：2014/12/20 01:39

配列変数に「あいうえお,かきくけこ,さしすせそ」と「たちつてと,なにぬねの,はひふへほ, 」を作ります。

次にselectboxA～Dのvalueを取得してif elseを使用してselectboxEのvalueに「あいうえお,かきくけこ,さしすせそ」か「たちつてと,なにぬねの,はひふへほ, 」を入れてあげればいいと思いますよ。

イメージ的には以下のような形だと思います。

selectboxA～Dのvalueがチェンジされた場合のイベントハンドラ {
if(～～～) {
selectboxE.value = 「あいうえお,かきくけこ,さしすせそ」
} else {
selectboxE.value = 「あいうえお,かきくけこ,さしすせそ」
}
}

この回答への補足

ご回答ありがとうございます。
条件式の書き方がいまひとつわからず、うまくいきません。よろしくお願い致します。

<script>
var a =[[あいうえお,かきくけこ,さしすせそ,],[たちつてと,なにぬねの,はひふへほ, ]];

この部分に書くscriptの条件式がうまく書けません。

日本語で書いてしまえば、下記のそれぞれのoptionに
selectboxA =1 selectboxB =い selectboxC =ウ selectboxD =e と
selectboxA =5 selectboxB =え selectboxC =ウ selectboxD =i の
と言う組み合わせが選択された時のみに、
selectboxE のoptionに「あいうえお,かきくけこ,さしすせそ」が表示される。
ようにしたいのですが。。。

</script>
<title></title>
</head>
<body>
<form name="myForm">
<select name="A" onChange="value_check()">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>|
<option value="5">5</option>
</select>

<select name="B" onChange="value_check()">
<option value="あ">あ</option>
<option value="い">い</option>
<option value="う">う</option>
<option value="え">え</option>
<option value="お">お</option>
</select>

<select name="C" onChange="value_check()">
<option value="ア">ア</option>
<option value="イ">イ</option>
<option value="ウ">ウ</option>
<option value="エ">エ</option>
<option value="オ">オ</option>
</select>

<select name="D" onChange="value_check()">
<option value="ａ">ａ</option>
<option value="ｉ">ｉ</option>
<option value="ｕ">ｕ</option>
<option value="ｅ">ｅ</option>
<option value="ｏ">ｏ</option>
</select>

<select name="E">
<option value="たちつてと">たちつてと</option>
<option value="なにぬねの">なにぬねの</option>
<option value="はひふへほ">はひふへほ</option>
</select>

</form>
</body>