我试图在元素移除后撤销我的总价。目前,当我删除一个项目时,我将总计设置为0
。
如果我有
benz - 150
bmw - 100 //with quantity of 2 meaning bmw price is 50
total - 250
但是当我从列表中删除宝马时,
我应该得到这样的东西
benz - 150
total - 150
当取消选择商品时,如何通过将总价反转为之前的价格来实现此目的?
function calc(goods) {
var product = JSON.parse(goods.dataset.goods);
if (goods.checked == true) {
$('.panel').append(
'<div class="container"> ' +
'<p class="name" >' + product.name + '</p>' +
'<p class="price" data-price="' + product.price + '">' + product.price + '</p>' +
'<p class="total" ><span class="sub-total" name="sub-total" id="sub-total"></span></p>' +
'<input type="text" class="form-control quantity" placeholder=" qty " name="quantity[]" required/>' +
'</div>'
)
} else {
$(".panel .container [data-id=" + product.id + "]").parent().remove();
$('.mygoods span').text(0);
}
}
$('.panel').on('keyup', '.quantity', function() {
var container = $(this).closest('div');
var quantity = Number($(this).val());
var price =
Number($(this).closest('div').find('.price').data('price'));
container.find(".total span").text(quantity * price);
sum = 0;
$(".sub-total").each(function() {
sum = sum + Number($(this).text());
})
$('.mygoods span').text(sum);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<p class="mygoods">GrandTotal <span></span></p>
</div>
<input onclick="return calc(this)" data-good="{{$good->toJson()}}" type="checkbox" />
当我取消选择一个项目时,即使我将总数加起来,旧文本也始终为 0 更新
function calc(goods) {
var product = JSON.parse(goods.dataset.goods);
if (goods.checked == true) {
$('.panel').append(
'<div class="container"> ' +
'<p class="name" >' + product.name + '</p>' +
'<p class="price" data-price="' + product.price + '">' + product.price + '</p>' +
'<p class="total" ><span class="sub-total" name="sub-total" id="sub-total"></span></p>' +
'<input type="text" class="form-control quantity" placeholder=" qty " name="quantity[]" required/>' +
'</div>'
)
} else {
var total = $(".panel .container [data-id=" + product.id + "]").parent().find(".total").text();
$(".panel .container [data-id=" + product.id + "]").parent().remove();
if (total) {
$('.mygoods span').text(function(oldtext) {
console.log('this is my old text '+oldtext)
return oldtext ? oldtext - total : oldtext;
});
}
}
}
最佳答案
在删除包含该产品小计的元素之前,获取 .total span
元素的文本,然后从总计中减去它。
} else {
var total = $(".panel .container [data-id=" + product.id + "]").parent().find(".total").text();
$(".panel .container [data-id=" + product.id + "]").parent().remove();
if (total) {
$('.mygoods span').text(function(oldtext) {
return oldtext ? oldtext - total : oldtext;
});
}
}
关于javascript - 取消选中复选框并修改总计 - JS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47450360/