Question

出于某种原因，当我更新数量时，总价格会变为我选择的每个输入的总价格。价格也不会在不同的小计中正确更新，第二个认为它是29.95。然后我也无法正确更新数量。这是我正在使用的演示：http://jsfiddle.net/656arnLy/

<body>
<input type="number" min="0" class=" qty form-control" id="quantity">
<input type="text" class="price form-control" id="price" value="29.95" readonly>
<input type="text" class="subtotal form-control" id="subTotal">
<br>
<input type="number" min="0" class=" qty form-control" id="quantity">
<input type="text" class="price form-control" id="price" value="2.99" readonly>
<input type="text" class="subtotal form-control" id="subTotal">
<br>Total Price:
<input type="text" readonly class="totalPrice" id="total">
<br>Total qty:
<input type="text" readonly class="totalQty" id="total">

$(function () {
$(".qty").change(function () {
    var qty = $(this).hasClass('qty') ? $(this).val() : $(this).siblings('.qty').val();
    var price = $(this).hasClass('price') ? $(this).val() : $(this).siblings('.price').val();
    price = price || 0;
    qty = qty || 0;
    var subtotal = price >= 1 && qty >= 1 ? parseFloat(price * qty) : 0;
    $(this).siblings('.subtotal').val(subtotal);
    var totalPrice = 0;
    var totalQty = 0;
    var update = false;
    $('.subtotal').each(function () {
        subtotal = parseFloat($(this).val()) | 0;
        totalPrice = subtotal ? (parseFloat(totalPrice + subtotal)) : totalPrice;
    });
    $('.qty').each(function () {
        qty = $(this).val();
        totalQty += qty;
    });
    $('.totalPrice').val(totalPrice);
    $('.totalQty').val(totalQty);
});

更新：我得到的总数正常，我只是无法获得数量。有没有办法绕过使用所以我可以把这个代码放在表中的每一行？

更新了网站：http://jsfiddle.net/656arnLy/14/

Answer 1

只需扫描您的代码，您的几个输入框就具有相同的ID值。您有两个输入，ID值为＃34;数量为＃34;，2为id值，依此类推。你绝对不想这样做。这可能会导致各种问题。此外，您还要更新$（this）.siblings行中具有classname .subtotal的所有输入。

为您的输入提供不同的ID值，并选择您要更新的ID，并且您将更接近您想要的内容。

JavaScript动态更新总数和总数

1 个答案: