前ページのリンクからフォーム内のセレクトボックスを連動させる

ページAにいくつかリンクボタンがあり、

そこからページBに遷移した際に
ページAでクリックした箇所に連動して

選択されているセレクトボックスを設置したいと考えています。

具体的には以下のようなものです。

【A.html】

<a href=“B.html” id=“asa”>あさ</a>　←ここをクリック
<a href=“B.html” id=“hiru”>ひる</a>
<a href=“B.html” id=“yoru”>よる</a>

↓

【リンク先のB.html内】

<select name="date">
<option value="">▼下記よりお選びください</option>
<option value=“あさ” selected>あさ</option>
<option value=“ひる”>ひる</option>
<option value=“よる”>よる</option>
</select>

というように前のページでクリックした場所が
次のページでセレクトボックスに反映されている、というものです。

getメソッドを利用して作成しようとしたのですがうまく機能しません。
何か良い方法がありましたらご教授いただけないでしょうか。
わかりにくい文章で申し訳ありませんが、どうぞ宜しくお願いいたします。

No.2 ベストアンサー 回答者： yambejp 回答日時： 2017/02/21 16:34

こんな感じでやってみてください

a.html
<a href="b.html?v=asa">あさ</a>　←ここをクリック
<a href="b.html?v=hiru">ひる</a>
<a href="b.html?v=yoru">よる</a>
<a href="b.html?v=dummy">ダミー</a>

b.html
<script>
window.onload=function(){
if(v=location.search.match(/(\?|&)v=(.+?)(?=&|$)/)){
if(t=document.getElementById(v[2])){
t.selected=true;
}
}
}
</script>
<select name="date">
<option value="">▼下記よりお選びください</option>
<option value="あさ" id="asa">あさ</option>
<option value="ひる" id="hiru">ひる</option>
<option value="よる" id="yoru">よる</option>
</select>

この回答へのお礼

コードまで書いていただきありがとうございます。
無事実装することができました。

お礼日時：2017/02/21 16:59

No.1 回答者： zircon3 回答日時： 2017/02/21 16:32

フォームのGET、POSTは関係ないのでは？

ようはページAのフォーム内に設けた変数に「あさ」、「ひる」、「よる」に応じた値をセットしてsubmit。
それを受け取ったサーバ側のプログラムがページBを生成する際にセレクトボックスの「あさ」、「ひる」、「よる」のどれにselectedを付けるかをその値で判断すればよいだけです。

参考まで。

この回答へのお礼

確かにそうですね…ご指摘ありがとうございます。

お礼日時：2017/02/21 16:59