从 jquery 购物车中获取余额

Question

我输入amount作为输入：

<input style="width:200px" type="number" value="amount" class="form-control pull-right prc" placeholder="Enter amount">

我的script是：

   $('.form-group').on('input', '.prc', function(){
    var totalSum = 0;
    var currbalance = 0;
    $('.form-group .prc').each(function(){
        var quantity = $(this).val();
        var price=$(this).attr('price');
        var item_amount= parseFloat(price*quantity);
        if ($.isNumeric(quantity)){
            totalSum += parseFloat(item_amount);
        }
        var amount=$(this).attr('amount');
        if ($.isNumeric(amount)){
            currbalance = amount - totalSum;
        }

    });
    $('#total_price').text('RM '+totalSum.toFixed(2));
    $('#balance').text('RM '+currbalance.toFixed(2));});

我想使用balance ID 显示它：

 <p>Balance: <b id="balance">RM 0.00</b></p>

但是我的输出没有显示。 我认为我的value=amount是错误的。

Answer 1

我已经将data-amount和data-price到您的输入中，然后我更改了currbalance = amount - totalSum; 到currbalance += (amount - totalSum); ，因为如果不是，那么currbalance将不等于data-amount

演示

 $('.form-group').on('input', '.prc', function() { var totalSum = 0; var currbalance = 0; $('.form-group .prc').each(function() { var quantity = $(this).val(); var price = $(this).attr('data-price'); var item_amount = parseFloat(price * quantity); if ($.isNumeric(quantity)) { totalSum += parseFloat(item_amount); } var amount = $(this).attr('data-amount'); if ($.isNumeric(amount)) { currbalance += (amount - totalSum); } }); $('#total_price').text('RM ' + totalSum.toFixed(2)); $('#balance').text('RM ' + currbalance.toFixed(2)); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="form-group"> <input style="width:200px" type="number" data-amount="120" data-price="12" class="form-control pull-right prc" placeholder="Enter amount"> <input style="width:200px" type="number" data-amount="220" data-price="22" class="form-control pull-right prc" placeholder="Enter amount"> </div> <p>Total: <b id="total_price">RM 0.00</b></p> <p>Balance: <b id="balance">RM 0.00</b></p>