抱歉,这只是一个简单的问题。问题是总金额只计算一行。它仅计算单击的特定产品的一行。那么,如何计算所有行的总量?
const cart = {};
let GrandTotal = 0;
function AddtoCart(productid, description, quantity, price) {
if (cart[productid]) {
cart[productid].qty += quantity;
} else {
cart[productid] = {
id: productid,
desc: description,
qty: quantity,
price: price
};
}
viewCart();
GrandTotal += parseFloat(cart[productid].price) * parseInt(cart[productid].qty);
document.getElementById("total").innerHTML = GrandTotal;
console.log(GrandTotal);
}
function viewCart() {
let tbody = document.getElementById('cartsBody');
tbody.innerHTML = '';
Object.values(cart).forEach(content => {
tbody.innerHTML += `<td>${ content.id }</td>
<td>${ content.desc }</td>
<td>${ content.qty }</td>
<td>${ content.price }</td>
<td>${ content.qty * content.price }</td>`;
});
}
<script src="script.js"></script>
<input type="button" value="Laptop" onclick="AddtoCart('132','Macbook Pro', 1, 79000,0)" />
<input type="button" value="Phone" onclick="AddtoCart('456','Iphone 5S', 1, 18000,0)" />
<input type="button" value="Camera" onclick="AddtoCart('789','Nikon 3D00', 1, 25000,0)" />
<table border="1|1" id="cartsTable">
<thead>
<tr>
<th>Product ID</th>
<th>Product Description</th>
<th>Quantity</th>
<th>Price</th>
<th>Total</th>
</tr>
</thead>
<tbody id="cartsBody">
</tbody>
</table>
<p id="total">Total: </p>
答案 0 :(得分:1)
我会每次从购物车数据中重新计算总计,而不是在您点击产品时尝试添加。您可能还想稍后删除项目。
function calculateGrandTotal(){
GrandTotal = 0;
for(let productid in cart){
if(cart.hasOwnProperty(productid)){
GrandTotal += parseFloat(cart[productid].price) * parseInt(cart[productid].qty);
}
}
}
在您的AddToCart
函数中,您只需调用calculate函数:
function AddtoCart(productid, description, quantity, price) {
// [...]
calculateGrandTotal();
document.getElementById("total").innerHTML = GrandTotal;
console.log(GrandTotal);
}
答案 1 :(得分:0)
每次单击addToCart时,都会将grandtotal设置为零。
在点击功能之外初始化您的grandtotal变量。