リロード時もコンボボックスの内容を保持したい

質問

リロード時もコンボボックスの内容を保持したい
select要素を使ったコンボボックスの作成で困っています。

1つ目のセレクトボックスで選んだ都道府県に対応した市を、
2つ目のセレクトボックスに反映させるところまではうまく行くのですが、
ページをリロード、あるいは遷移先から戻ってくると、
1つ目のセレクトボックスを別のものに再選択しないと2つ目が選べない状態になります。

対応方針として、ページロード時に都道府県を選んでいれば、
2つ目のセレクトボックスを再構築するサブルーチンの処理に回すことを考えたのですが（サンプルのコメントアウト部分です。）、
引数に問題があるのか、どうも再構築がうまく行きません。

現状のHTMLを活かしたまま、Javascriptの変更のみで
要望の動きを実現させる方法をご教示いただけないでしょうか。

回答No.1

yambejp · ベストアンサー

ある程度の精度が必要であれば、クッキーに保存しておいて
onloadで処理をすることです。

お礼

ご回答ありがとうございました。
サンプルのソースコードを追記したかったのですが、、方法がわからないので、
勝手ながら、一旦質問を閉じたいと思います。

補足

ご回答ありがとうございます。
できるならば、Cookieは使いたくないところです。

質問時にソースが貼れなかったので、以下に貼り付けます。
------------------------------
//スクリプト部分
<script>
function ConnectedSelect(selIdList){
for(var i=0;selIdList[i];i++) {
var CS = new Object();
var obj = document.getElementById(selIdList[i]);
if(i){
CS.node=document.createElement('select');
var GR = obj.getElementsByTagName('optgroup');
while(GR[0]) {
CS.node.appendChild(GR[0].cloneNode(true));
obj.removeChild(GR[0]);
}
obj.disabled = true;
}
if(selIdList[i+1]) {
CS.nextSelect = document.getElementById(selIdList[i+1]);
obj.onchange = function(){ConnectedSelectEnabledSelect(this)};
}
// if(obj.value !== "#") {
// alert(obj.value);
// ConnectedSelectEnabledSelect(obj);
// }
obj.ConnectedSelect = CS;
}
}

function ConnectedSelectEnabledSelect(oSel){
var oVal = oSel.options[oSel.selectedIndex].value;
if(oVal) {
while(oSel.ConnectedSelect.nextSelect.options[1])oSel.ConnectedSelect.nextSelect.remove(1);
var eF = false;
for(var OG=oSel.ConnectedSelect.nextSelect.ConnectedSelect.node.firstChild;OG;OG=OG.nextSibling) {
if(OG.label == oVal) {
eF = true;
for(var OP=OG.firstChild;OP;OP=OP.nextSibling)
oSel.ConnectedSelect.nextSelect.appendChild(OP.cloneNode(true));
break;
}
}
oSel.ConnectedSelect.nextSelect.disabled = !eF;
} else {
oSel.ConnectedSelect.nextSelect.selectedIndex = 0;
oSel.ConnectedSelect.nextSelect.disabled = false;
}
}
</script>

//HTML部分に続く