Question

我在jQuery中从Quantity计算价格有一个小问题。这些是我的输入框。

Quantity: <input type="text" style="width: 50px;" name="quantity" id="quantity" class="txt" value="1" />

Price: <input type="text" style="width: 50px;" name="item_price" id="item_price" class="txt" value="2990" />

Total Price: <input type="text" style="width: 50px;" name="total_price" id="total_price" class="txt" value="" />

Answer 1

我假设您需要公式或如何获取输入元素的值：

var quantity = $("#quantity").val();
var iPrice = $("#item_price").val();

var total = quantity * iPrice;

$("#total_price").val(total); // sets the total price input to the quantity * price

alert(total);

编辑密钥：

$('#quantity').keyup(function() {
   var quantity = $("#quantity").val();
   var iPrice = $("#item_price").val();

   var total = quantity * iPrice;

   $("#total_price").val(total); // sets the total price input to the quantity * price
});

Answer 2

已更新 以在脚本代码中显示完整示例

如果您需要公式以及如何“看到”更改：

<script type="text/javascript">
    $(function() {  //  In jQuery 1.6+ this is same as $(document).ready(function(){})
        $('#quantity, #item_price')  //  jQuery CSS selector grabs elements with the ID's "quantity" & "item_price"
            .on('change', function(e) {  //  jQuery 1.6+ replcement for .live (dynamically asigns event, see jQuery API)
            //  in this case, our event is "change" which works on inputs and selects to let us know when a value is changed
                //  below i use inline if statements to assure the values i get are "Real"
                var quan = $("#quantity").val() != "" ? parseFloat($("#quantity").val()) : 1,  //  Get quantity value
                    pric = $("#item_price").val() != "" ? parseFloat($("#item_price").val()) : 0;  //  Get price value
                $('#total_price').val(pric*quan); // show total
            });
    });
</script>

在jQuery中从数量输入框计算价格

2 个答案: