Question

我的表单中有以下输入。 total（输入名称）和balance（输入名称）的值相同。当任何用户在输入中输入paid_amount的值时，我想从总计中自动减去paid_amount值，并将结果作为balance的值放入输入中。

你能否告诉我如何使用jquery做到这一点。

由于

<input type="text" name="total" id="total" value="<?php echo $total;?>" />

<input type="text" name="paid_amount" id="paid_amount" value="" />

<input type="text" name="balance" id="balance" value="<?php echo $total;?>" />

Answer 1

$('#paid_amount').on('keyup', function() {
   if($.trim(this.value).length) {
     var balance = parseFloat($('#total').val()).toFixed(2) - 
                   parseFloat(this.value).toFixed(2);
     $('#balance').val(balance);
   }
});

Answer 2

$("#paid_amount").on("keyup", function() {
    var val = +this.value || 0;
    $("#balance").val($("#total").val() - val);
});

DEMO： http://jsfiddle.net/f6Ggk/

要设置精度，您可以使用toFixed()：

$("#paid_amount").on("keyup", function() {
    var val = +this.value || 0;
    var result = $("#total").val() - val;
    $("#balance").val(result.toFixed(2));
});

DEMO： http://jsfiddle.net/f6Ggk/1/

Answer 3

<块引用>

原价减去折扣后的销售价

    $('#product_row').find('#r_price,#p_discount').on('keyup',function (e) {
             $regular_price = $('#r_price').val() ;
             $sale_discount = $('#p_discount').val() ; 
             $sale_price = ( $regular_price - $sale_discount ) ;
             $('#s_price').val($sale_price);
             console.log($sale_price); 
        });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="product_row">
                                  
                                    <div class="form-group">
                                        <label>
                                           Price
                                          <b class="text-danger">*</b>
                                        </label> 
                                        <input
                                          id="r_price"
                                          type="number"
                                          name="regular_price"
                                          class="form-control"
                                          required
                                          placeholder="0"
                                        />
                              
                                      </div>
                                 
                                      <div class="form-group">
                                          <label> Discount </label>
                                          <input
                                           id="p_discount"
                                            type="number"
                                            name="discount"
                                            class="form-control"
                                            placeholder="0"
                                          />
                                        </div>                        
                              
                                    <div class="form-group">
                                        <label>
                                          Sale Price
                                          <b class="text-danger">*</b>
                                        </label>
                                        <input
                                          id="s_price"
                                          type="number"
                                          name="sale_price"
                                          class="form-control"
                                          readonly
                                        />
                              
                                      </div>
                          
                                 </div>

使用jquery减去keyup上的值

3 个答案: