■今回やりたいこと
以下のような検索ボックスで、
「エリア・地名」、「タグ」の部分にテキストが入り、
検索というボタンを押すと、
URLにパラメーターを付けて渡してリンクさせたいです。
https://hoge.jp/search/?area=静岡&word=遊ぶ
↑このような形にしたいです。
下記のjavascriptのように
var URLを外側に書くと、val1とval2の値が引っ張ってこれず、URLに反映されません。
どのように書けば処理がされるのかわからず、どなたかご教示いただけますでしょうか。
よろしくお願いいたします。
html
1<div class="search-field_box"> 2 <ul class="search-field"> 3 <li> 4 <i class="fa fa-compass" aria-hidden="true"></i><input type="text" class="bt1" placeholder="エリア・地名" id="text"> 5 </li> 6 <li> 7 <i class="fa fa-map-marker" aria-hidden="true"></i><input type="text" class="bt2" placeholder="タグ"> 8 </li> 9 </ul> 10 <div class="result"> 11 <form name="bt" method="post" id="bt" action="/"> 12 <button type="submit" value="submit"> 13 <i class="fa fa-search" aria-hidden="true"></i><span>検索</span> 14 </button> 15 </form> 16 </div> 17</div>
javascript
1 $(function(){ 2 3 //サーチフィールド 検索処理 4 $(document).on('change', '.search-field input.bt1', function(){ 5 var val1 = $(this).val(); 6 }); 7 $(document).on('change', '.search-field input.bt2', function(){ 8 var val2 = $(this).val(); 9 }); 10 11 var url = "https://hoge.jp/search/?area="+val1+"&word="+val2; 12 $("form").attr("action", url); 13 14 });
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/01/04 08:50
退会済みユーザー
2018/01/04 08:52
2018/01/04 08:54
退会済みユーザー
2018/01/04 08:58
2018/01/04 09:12