selectのoptionを操作する

解決済

質問者：kamay
質問日時：2004/02/26 18:45
回答数：3件

A、Bという２つのプルダウンメニューがあります。
Aにはaa、bb、ccという項目があらかじめ固定値で入っています。
Bは初期状態ではなにも表示されません。
Aのメニューからaaを選ぶと、Bにdd、eeという項目が表示されます。
Aのメニューからbb、ccを選んだ時はBのプルダウンメニューには何も表示されません。

Aからaaが選ばれたか判定するところまではできたのですが、Bのプルダウンメニューにdd、eeを表示させる方法がわかりません。
どのようにすればうまくいくでしょうか？

HEAD部>>
function GetMenu() {
var index = tstFrm.menuA.selectedIndex;
var str = tstFrm.menuA.options[index].value;
if (str == "aa") {
/************************************************/
/ここがわかりません
/************************************************/
}
}

BODY部>>
<form name="tstFrm" onChange="GetMenu()">
<select name="menuA">
<option value="aa">aa
<option value="bb">bb
<option value="cc">cc
</select>
<select name="menuB">
/************************************************/
/ここもわかりません
/************************************************/
</select>

menuAのvalueがaaの時に、menuBが
<option value="dd">dd
<option value="ee">ee
menuAのvalueがbbまたはccの時に、menuBが
<option value="">
となるようにしたいのです。

アドバイスお願い致します。
わかりにくくてすみません。

通報する

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

質問の本文を隠す

回答 (3件)

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

No.2ベストアンサー

回答者： wolv
回答日時：2004/02/26 22:56

コード書いてみました。

- 0
- 件

通報する

この回答へのお礼

ありがとうございます。
助かります＾＾

通報する

お礼日時：2004/03/01 09:46

No.3

回答者： kata_kori
回答日時：2004/02/26 23:00

これでいけると思います。

説明は割愛しますので解読してみて下さい。
<html>
<head>
<script>
function GetMenu(str) {
　var frm = document.tstFrm;
//既存option削除
　for (var i=0; i<frm.menuB.length; i++) {
　　frm.menuB.options[0] = null;
　}
//option再設定
　frm.menuB.options[0] = new Option("","");
　if(str == "aa") {
　　frm.menuB.options[1] = new Option("dd","dd");
　　frm.menuB.options[2] = new Option("ee","ee");
　}
}
</script>
</head>
<body>
<form name="tstFrm">
<select name="menuA" onChange="GetMenu(this.value)">
<option value=""></option>
<option value="aa">aa</option>
<option value="bb">bb</option>
<option value="cc">cc</option>
</select>
<br><br>
<select name="menuB">
</select>
</form>
</body>
</html>