如何更新选择值的更改价格

时间:2016-05-16 07:22:22

标签: javascript php jquery

我需要将select选项的值更改为select字段中选择的值,还需要更新select选项的更改价格,如何使用jquery

$a =5000;
$b=225;
 $c=25;

                          <p> base fair echo $a</p>
 <p id='options'>value of select option  250</p>// change price depending on select option 
     <p> tax </p>                       echo $b
  <p>other charges</p>                  echo  $c
    <p>Total price  </p>               echo $a+250+$b+$c// change price once the select option changes 

  <select>
 <option value="250">250</option>
  <option value="300">300</option>
<option value="350">350</option>
  <option 400="audi">400</option>
</select>

2 个答案:

答案 0 :(得分:0)

试试这个:

HTML:

<?php 
$a =5000;
$b=225;
$c=25;
?>

<p>base fair <span id="basicVal"> <?php echo $a ?> </span> </p> 
<p id='options'>value of select option  <span id="optionVal"> 250 </span> </p> 
<p>tax </p> <span id="taxVal"> <?php echo $b ?> </span>
<p>other charges <span id="otherVal"> <?php echo  $c; ?> </span> </p>
<p>Total price  </p> 
<br /><span id="total" ><?php echo $a+250+$b+$c ?> </span>

<select id="selection">
 <option value="250">250</option>
 <option value="300">300</option>
 <option value="350">350</option>
 <option value="400">400</option>
</select>

Jquery的:

$("#selection").change(function() {
        var val = parseInt($(this).val());
        $("#optionVal").text(val);
        var basVal = parseInt($("#basicVal").text());
        var tax = parseInt($("#taxVal").text());
        var other_changes = parseInt($("#otherVal").text());
        var total = basVal + val + tax + other_changes;
        $("#total").text(total);
});

答案 1 :(得分:0)

你可以通过这个简单的代码实现这一目标......

在隐藏输入中取$a,$b,$c的总和,并在更改选择框时获取所选选项的值和$a,$b,$c隐藏输入的值,添加两个值并更改总数的html并在表单提交的隐藏字段中设置总数...

<?php 
$a =5000;
$b= 225;
$c= 25;
$abc_toal = 5000+225+25;
?>
<input type="hidden" name="abc_total" id="abc_total" value="<?php echo $abc_toal; ?>" />
<p> base fair :  5000</p>
<p> Select Price 
    <select  id="price" >
        <option value="250">250</option>
        <option value="300">300</option>
        <option value="350">350</option>
        <option value="400">400</option>
    </select> 
</p>
<p> tax : 225</p>
<p>other charges : 25</p>

<p id="total_html" >Total price : 5500 </p>
<input type="hidden" id="total" />

脚本代码

<script>
$(document).ready(function(){
    $('#price').change(function(){
        var abc_total = parseInt($('#abc_total').val());
        var selected_price = parseInt($(this).val());
        var total = (abc_total+selected_price);

        $('#total_html').html('Total price : '+total );
        $('#total').val(total);

    });
});
</script> 

<强> LIVE DEMO