ダブルでコンボボックスについて

解決済

質問者：sunny65
質問日時：2004/08/25 22:55
回答数：2件

1つ目のコンボボックスで都道府県を選択できるとします。２つ目のコンボボックスは1つ目で選択した県の市町村が選べるようにしたいんですが、JavaScriptではどのように記述すればよいのでしょうか？
めちゃくちゃ人頼みで申し訳ないのですが、急いでいるので教えて下さい（－人－）

通報する

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

質問の本文を隠す

回答 (2件)

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

No.2ベストアンサー

回答者： Shinoa
回答日時：2004/08/26 14:43

こんな感じでどうですか？

データの設定方法は、一番目に都道府県名、N個の市町村名、最後は"END"の文字列としてます。
後はお好みで改造してください。
少しでも参考になれば幸いです。

<script langage="javaScript">

PREF_NUM=47;　　//　都道府県数

PREF=[　["北海道","苫小牧市","札幌市","室蘭市","END"],
　　　　["青森県","青森市","弘前市","END"],
　
　　　～　略　～
　
　　　　["大阪府","大阪市","枚方市","堺市","END"],
　　　　["沖縄県","那覇市","END"]
　　　];
　
function setItem(){
　clearItem() ;
　no = document.myForm.PrefName.selectedIndex ;
　cnt = 1 ;
　while(1){
　　if ( PREF[ no ][ cnt ] == "END" ) break ;
　　document.myForm.CityName.options[ cnt-1 ] = new Option( PREF[ no ][ cnt ], PREF[ no ][ cnt ] ) ;
　　cnt++ ;
　　}
}

function clearItem(){
　itemNum = document.myForm.CityName.length
　for ( i=0; i<itemNum; i++ ){
　　document.myForm.CityName.options[ i ] = null ;
　}
}

function setPrefItem(){
　for ( cnt=0; cnt<PREF_NUM; cnt++ ){
　　document.myForm.PrefName.options[ cnt ] = new Option( PREF[ cnt ][ 0 ], PREF[ cnt ][ 0 ] ) ;
　}
　document.myForm.PrefName.selectedIndex = 0 ;
}

function initialize(){
　setPrefItem() ;
　setItem() ;
}
</script>
<body onLoad="initialize()">

<form name="myForm">
　<select name="PrefName" onChange="setItem()">
　　<option value="">
　</select>
　<select name="CityName">
　　<option value="">
　</select>
</form>

- 0
- 件

通報する

この回答へのお礼

大変参考になりました。
ありがとうございます。
お詳しいのですね。私もこれから勉強していきます。

通報する

お礼日時：2004/08/26 17:35

No.1

回答者： Blackwingls
回答日時：2004/08/26 00:06

こんばんわぁ、Blackwinglsです。

手元にあったscriptが使えそうなので少し弄ってみました。
case文に変更するなりループ回すなりすると結構面白そうですね。

ではでは～☆彡

<HTML>
<HEAD>
<TITLE>test</TITLE>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>
</HEAD>
<BODY>
*後からフォームの内容を変える<P>
<HR>
男の子用・女の子用の2通りのプレゼントを用意しました、どちらか選んでください。<BR>
<FORM>性別
<SELECT onChange="BYGR()">
<OPTION VALUE="">
<OPTION VALUE="BOY">男
<OPTION VALUE="GIR">女
</SELECT>
<P>
<SELECT>
<OPTION>男の子用・女の子用どちらか選んで下さい
<OPTION>-------------------------------------
<OPTION>-------------------------------------
<OPTION>-------------------------------------
</SELECT>
</FORM>
</BODY>
</HTML>