javascript - 如何在删除字段时计算输入字段值并将其分配给另一个字段

Question

我正在尝试计算一组重复字段的总数。

这是我的标记

<label for="name" class="p-label-required">Amount <span style="color: red"> (Numbers only)</span></label>
<input type="text" id="amount" name="amount[]" placeholder="Amount" required="required" class="form-control inputChangeVal reqF" data-js-input-type="number" /><br/>

<div class="add_another_st"></div>
<button class="btn add_another_st_btn" style="margin-bottom: 25px;">+</button>
<hr style="margin-top: 0;">
Total Amount:
<input type="text" class="totalAmount" id="updatedTotalAmount" style="font-size: 20px; font-weight: bold; margin-bottom: 25px; border: 0;" readonly />

这是我的 jQuery，用于在 amount 字段上发生某些情况时计算总数。 它正确计算总计并将其分配给总金额字段。

/* calculating and updating the total amount */
    function updateTotal() {
        var price = 0;

        jQuery(".inputChangeVal").each(function() {
            var t = parseFloat(jQuery(this).val(), 10);
            price = price + t;
        });

        var total = price.toFixed(2);
        jQuery(".totalAmount").val(total);
        console.log('updateTotal Runs');
    }
    jQuery(document).on("change, keyup", ".inputChangeVal", updateTotal);

但我想在删除金额字段时再次计算金额，并且每当删除金额字段时它不起作用/更新总计。

我为此创建的代码位于 js fiddle 中

删除字段后如何再次更新总计？

Answer 1

向上滑动 wrapper 元素时需要调用 updateTotal() 函数。

jQuery(this).parent('div').slideUp(1000, function() {
    jQuery(this).remove();
    x--;
    updateTotal(); // updating total
});

<强> Working fiddle