我正在尝试计算一组重复字段的总量。
这是我的标记
<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
字段上发生事件时的总数。
它会正确计算总数并将其分配给total 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
如何在删除字段时再次更新总数?
答案 0 :(得分:1)
在向上滑动updateTotal()
元素时,您需要调用wrapper
函数。
jQuery(this).parent('div').slideUp(1000, function() {
jQuery(this).remove();
x--;
updateTotal(); // updating total
});
<强> Working fiddle 强>
答案 1 :(得分:0)
jQuery(wrapper).on("click", ".remove_field", function(e) { //user click on remove text
debugger;
e.preventDefault();
jQuery(this).parent('div').slideUp(1000, function() {
jQuery(this).remove();
x--;
/*running again calculation 0f the total amount and while removing an amount */
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 while removing');
});
});