やりたいことを日本語で表現するのはムズイデズネ...
やりたいこと
任意のページのボタンからのお問い合わせフォームへの訪問は、あらかじめその項目が選択済となってお問い合わせフォームが表示されるようにしてほしいとの要望があったので初心者ながらも調べてみました。
(これが最適かどうかもわかりませんのでより良い方法があれば教えてください)
流れ
- 元のaタグにURLパラメーターを設置しておく
- 訪問先であるお問い合わせフォームにて、そのURLパラメーターの取得
- もしそのパラメーターのidとselectbox の選択肢(option)のidが一致すればその選択肢が選択済になるようにする
という流れにしようと思いました
1. 元のaタグにURLパラメーターを設置
<a href="hogehoge/contact/?id=lecture">
2. 訪問先であるお問い合わせフォームにて、そのURLパラメーターの取得
// URLのパラメータを取得
var urlParam = location.search.substring(1);
-
location.searchは現在のページのクエリ情報(URLの末尾にある「?〜」)の文字を取得
▼参考サイト
JavaScriptのlocation.searchでクエリ情報を取得してみる -
substring()の使い方は
var str = '文字列';
str.substring(開始位置, 終了位置);
で、引数が一つなので、一文字目から最後までを抽出という意味です
▼参考サイト
substringで文字の切り出し
3.もしそのパラメーターのidとselectbox の選択肢(option)のidが一致すればその選択肢が選択済になるようにする
もしそのパラメーターのidとselectbox の選択肢(option)のidが一致すれば
var urlParam = location.search.substring(1);
// URLにパラメータが存在する場合
if(urlParam) {
//処理
}
選択肢が選択済になるようにする
document.getElementById('lecture').selected = true;
ということで1、2、3を合わせると、
var urlParam = location.search.substring(1);
// URLにパラメータが存在する場合
if(urlParam) {
document.getElementById('lecture').selected = true;
}
出来上がりですね
selectboxにidをつけて、
その子要素の何番目option[2]とかで要素を取得してもできまする。