Question

我的数据库表（包）是这样的：

id, package, price

当我选择一个包时，价格应自动显示而不刷新页面。

 <div class="form-group"><label class="col-lg-3 control-label">Package</label>
 <div class="col-lg-4">                                
  <select class="form-control" name="packageID">
  <option value="-1">Select Package</option>
 <?php 
    $select_package = mysql_query("SELECT * FROM package order by package");
    while($row = mysql_fetch_array($select_package)){
    echo "<option value='".$row[0]."'>";
    echo $row[1];                                        
    echo "</option>";
    }
    ?>
    </select>
    </div>
    </div>

 <div class="form-group"><label class="col-lg-3 control-label">Price</label>
 <div class="col-lg-4"><input type="text" name="price" placeholder="" class="form-control"></div>
</div>

帮我编码

Answer 1

试试这个

            <div class="form-group"><label class="col-lg-3 control-label">Package</label>
             <div class="col-lg-4">                                
              <select class="form-control" name="packageID">
              <option value="-1">Select Package</option>
             <?php 
                $select_package = mysql_query("SELECT * FROM package order by package");
                while($row = mysql_fetch_array($select_package)){
                echo "<option value='".$row[0]."' data-price=\"$row[2]\">";
                echo $row[1];                                        
                echo "</option>";
                }
                ?>
                </select>
                </div>
                </div>

             <div class="form-group"><label class="col-lg-3 control-label">Price</label>
             <div class="col-lg-4"><input type="text" name="price" placeholder="" class="form-control"></div>
            </div>
            <script src="http://code.jquery.com/jquery-latest.js"></script>
            <script type="text/javascript">
            $(document).ready(function(){
                $('[name=packageID]').on('change', function(){
                    var price = $(this).find('option:selected').data('price');
                    $('[name=price]').val(price);
                })
            });
            </script>

用javascript显示某些包的价值（价格）

1 个答案: