引導選擇下拉菜單以更改搜索條件

Question

我想通過主下拉列表更改多個孩子的俯臥撐。

即得到改變以紅色標記下面的圖片搜索準則（這也是下拉列表，而是基於主下拉完全不同的搜索條件選擇）

我怎麼可以這樣做？

更新： 我有一些現有的代碼，就選擇它正在改變什麼已經從下拉列表中選擇文本。有沒有辦法可以修改下面的代碼？

REAL.searchBy = function() { 
 
      $('.search_by').find('select').change(function(){ 
 
      var search_by= $(this).val(); 
 
      $(this).parents('.search_by').find('.search_by_keyword').val('Enter '+(search_by)); 
 
      $(".search_by_keyword").attr('name',search_by.toLowerCase()).focus(); 
 
      }) 
 
\t }

<div class="search_by"> 
 
           <div class="search-field"> 
 
            <label>Search By</label> 
 

 
            <select class="form-control selectpicker" name="search_by" style="display: none;"> 
 
             <option selected="">Search By</option> 
 
             <option value="Id">Id</option> 
 
             <option value="test">test</option> 
 
             <option value="Pincode">Pincode</option> 
 
            </select> 
 
           
 
           </div> 
 
           <div class="search-field"><label>Keyword</label> 
 
           \t  <input type="text" placeholder="Please enter " class="form-control input-lg search_by_keyword" name="pincode"> 
 
           </div> 
 
       </div>

Answer 1

這裏有一個方法如何歸檔你所期望的：

$('.search_by').find('select').change(function(){ 
 
    var search_by= $(this).val(); 
 
    $(this).parents('.search_by').find('.search_by_keyword').val('Enter '+(search_by)); 
 
    $(".search_by_keyword").attr('name',search_by.toLowerCase()).focus(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="search_by"> 
 
    <div class="search-field"> 
 
     <label>Search By</label> 
 

 
     <select class="form-control selectpicker" name="search_by"> 
 
      <option selected="">Search By</option> 
 
      <option value="Id">Id</option> 
 
      <option value="test">test</option> 
 
      <option value="Pincode">Pincode</option> 
 
     </select> 
 
           
 
    </div> 
 
    <div class="search-field"> 
 
     <label>Keyword</label> 
 
     <input type="text" placeholder="Please enter " class="form-control input-lg search_by_keyword" name="pincode"> 
 
    </div> 
 
</div>