- ベストアンサー
javascriptでの2つのプルダウンメニューの初期値
- javascriptを使用して2つの連動するプルダウンメニューを作成しましたが、初期表示時に2つ目のメニューが空白のまま表示されてしまいます。
- ブラウザの戻るボタンで戻っても2つ目のメニューが空白のままになります。
- どのようにすれば2つ目のメニューを選択しなくても初期表示時に値が選択された状態になるのでしょうか?
- みんなの回答 (2)
- 専門家の回答
質問者が選んだベストアンサー
フォームの値は通常ならブラウザが記憶しているのですが、 「都市の選択」の方はロード時(JSで動的に追加する前)のoptionが1つしかないし、 そうでなくても動的にoptionを全部消しているし、 optionの値を書き換えただけでもリセットされるようなので、 cookieを使うしか方法はなさそうです。
その他の回答 (1)
- imq
- ベストアンサー率72% (16/22)
wondow.onloadの時にもonchangeの内容を実行すればいいと思います。 ↓一例ですが window.onload = function(){ var e, l; (l = function(el) { var selNo = el.selectedIndex; var selObj = document.getElementById("selSub"); var optionData = [ ["国名を選択してください,"], ["東京,tokyo","大阪,osaka","名古屋,nagoya"], ["ニューヨーク,ny","ロサンゼルス,la"] ]; var i, tmp = []; while(selObj.hasChildNodes()) { selObj.removeChild(selObj.firstChild); } for (var i=0; i<optionData[selNo].length; i++){ tmp = optionData[selNo][i].split(","); selObj.options[i] = new Option(tmp[0], tmp[1]); } })(e = document.getElementById("selMain")); e.onchange = function() { l(this); }; }
お礼
ありがとうございます 教えて頂いた方法で希望通りの動作ができるようになりました! ブラウザの戻るで戻ったり、onclick="history.back()"で入力画面に戻っても国名、都市名のプルダウンともに空白になることなく表示されました。 1点、教えて頂きたいのですが、onclick="history.back()"などで戻った場合、国名のプルダウンは先に選択した項目が表示されますが、都市名のプルダウンは一番上の都市(日本ならば東京、アメリカならニューヨーク)が表示されます。 これを国名のプルダウン同様に選択していたものを表示させることが可能なようならば、教えて頂けませんでしょうか?
お礼
アドバイスありがとうございます。 仰られる通りcookieを使い方法しかなさそうですが、最初にアドバイスを頂いた方法でも十分期待通りの動作をしてくれるので助かりました。 教えて頂きありがとうございました。 また、質問させて頂いた時にはよろしくお願いします。