为什么总金额仅在一行计算

时间:2017-07-14 14:12:39

标签: javascript ecmascript-6

抱歉,这只是一个简单的问题。问题是总金额只计算一行。它仅计算单击的特定产品的一行。那么,如何计算所有行的总量?

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>

2 个答案:

答案 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变量。