根據輸入值僅顯示下拉菜單中的選項值

Question

我對任何人都有輸入字段。現在根據輸入給出我只想顯示那些可以容納輸入值的表格。

<div class="control-group "> 
    <label class="control-label" for="Name">No. of people :</label> 
    <div class="controls"> 
     <input type="text" name="num_of_people" id="num_of_people" required> 
    </div> 
</div> 
<div class="control-group "> 
    <label class="control-label" for="Name"> Select Table :</label> 
    <div class="controls"> 
     <select name="table_id" id="table_id" class="reserv_select"> 
      <option value="">Select</option> 
      <?php foreach ($tables as $table) { ?> 
       <option rel="<?php echo $table->num_of_people ?>" value="<?php echo $table->id ?>"><?php echo $table->table_num ?></option> 
      <?php } ?> 
     </select> 
    </div> 
</div> 

其中選項值的rel給人no.How我可以實現這個使用jQuery。

我曾嘗試以下：

<script type="text/javascript"> 
    $(document).ready(function() { 
     var select = $('#table_id'); 
     var options = select.find('option'); 
     $('#num_of_people').change(function() { 
      var visible = options.filter('[value="' + $(this).val() + '")]').show(); 
      options.not('visible').hide(); 
     }) 
    }) 
</script> 

任何幫助/建議我真的很有幫助。提前致謝。

Answer 1

嘗試

$('#num_of_people').change(function() { 
     options.hide().filter('[value="' + $(this).val() + '"]').show(); 
    })