php - 追加相关的子选择选项一次

Question

更改主选择后，如何在子选择菜单中追加选择选项

问题是每次我更改选择选项时都会添加选项

如何使每个主要选择选项仅选择其相关选项一次

html&php:

  <?php
    $get_tables=$this->db->query("select * from floor_plan where fp_name='bellevue' and status='available' order by abs(t_id)");
    ?>
    <div class="form-group">
     <label for="qtn">Choose Table:</label>
    <select name="parent_table" id="table_all_numbers" class="form-control">
    <?php
    while($each_row=$get_tables->fetch_assoc()){

            ?>
        <option rel="<?php echo $each_row['ava_seats']; ?>" class="<?php echo $each_row['t_name']; ?>" value="<?php echo $each_row['t_id']; ?>">#<?php echo $each_row['t_id']; ?> &nbsp;<?php if($each_row['t_name']=='vip'){echo   '$'.$each_row['price']."/Table";}else{echo '$'.$each_row['price']."/Seat";} ?></option> 
            <?php

    }
    ?>
    </select>
   </div>

jquery:

var $items = $('select[name=parent_table]');
//quantity
$items.change(function(){
    var $this=$(this).find(':selected'),
    rel=$this.attr('rel');

   for(i=0;i<=rel;i++){

          $("#qtn").show();
          $("<option value='"+i+"'>"+i+"</option>").appendTo('#qtn');
   }

})

Answer 1

试试这个

$items.change(function(){
  var $this=$(this).find(':selected'),
    rel=$this.attr('rel');

  $('#table_all_numbers').html('');
  for(i=0;i<=rel;i++){
    $('#qtn')
      .append($('<option></option>')
      .attr("value", i)
      .text(i)); 
  }
  $("#qtn").show();
});