- ベストアンサー
連動するプルダウンリストの作成
- Javascriptの三次元配列を利用してさらに市町村を選択できるリストを作成する方法について
- エリアと都道府県を選択できるプルダウンリストを作成し、連動するようにする方法について
- 二次元配列を使った連動するプルダウンリストの作成方法について紹介します
- angela0704
- お礼率33% (1/3)
- JavaScript
- 回答数3
- ありがとう数4
- みんなの回答 （3）
- 専門家の回答
質問者が選んだベストアンサー
#1です。 body部分は極力元のままで動くサンプルを書いてみました。 <html> <head> <title></title> <script type="text/javascript"> function sampleSub(SEL,LIST){ while(SEL.options[1])SEL.remove(1); if(LIST) { for(var i=0;LIST[i];i++) { var OPT = document.createElement('option'); OPT.value = LIST[i]; OPT.appendChild(document.createTextNode(LIST[i])); SEL.appendChild(OPT); } } SEL.selectedIndex = 0; if(SEL.onchange)SEL.onchange(SEL,null); } function sample1(SEL){ var LIST = new Array(); LIST['関東']=['東京都','神奈川県']; LIST['近畿']=['大阪府','兵庫県']; sampleSub( document.getElementsByName('s2')[0], LIST[SEL.options[SEL.selectedIndex].value]); } function sample2(SEL){ var LIST = new Array(); LIST['東京都']=['品川区','渋谷区']; LIST['神奈川県']=['横浜市','川崎市']; LIST['大阪府']=['大阪市','吹田市']; LIST['兵庫県']=['明石市','尼崎市']; sampleSub( document.getElementsByName('s3')[0], LIST[SEL.options[SEL.selectedIndex].value]); } </script> </head> <body> <form name='frm'> <select onChange="sample1(this)"> <option value=''>エリア名</option> <option value='関東'>関東</option> <option value='近畿'>近畿</option> </select> <select name='s2' size=1 onChange="sample2(this)"> <option>都道府県</option> </select> </form> <select name='s3' size=1"> <option>市町村</option> </select> </form> </body> </html>
その他の回答 (2)
- steel_gray
- ベストアンサー率66% (1052/1578)
#1です。 #2のサンプルは</form>が途中に一つ余計にありますので削除してください。 （動作しか確認しなかった。）
補足
ありがとうございます。 早速試してみます。
- steel_gray
- ベストアンサー率66% (1052/1578)
http://d.hatena.ne.jp/Mars/20071109 こちらのライブラリを使うと楽かも。
補足
steel_grayさん、ありがとうございます。 このライブラリを使うと確かに楽に出来るのですが、これをCGIに応用したいのでHTMLのBODYのタグの中にはあまり値を書き込みたくないと考えています。 他にいい方法をご存知であれば、教えて頂きたいです。
お礼
ありがとうございました。 ちゃんと思ったとおりのものが出来ました。