javascript - 在javascript中更新总价

Question

大家好，我有一个简单的问题，我不是最擅长 JavaScript 的，但我想知道如何更新总数。我有一个按钮，我可以将商品添加到购物车并且更新很好，所以我使用相同的方法尝试更新总价，但它只工作一次，然后就不会再添加了。

所以当我第一次添加商品时，购物车更新 +1，价格变为 565

第二次我将购物车更新为 +2，这是完美的，但价格保持在 565，而应该是 1130。

在这件事上的任何帮助都会很棒

HTML:

<a class="shopping-cart" href="#"><i class="fa fa-shopping-cart"></i> <span class="cart-badge">0</span></a>
<p class="cartPrice">0.00 kr</p><input id="search-submit" type="submit">

Javascript:

var currentItems = 0;
var cartPrice = 565.00;
$(document).ready(function(){
       $(".add-to-cart").click(function(){
           currentItems++;
           cartPrice + cartPrice;
           $(".cart-badge").text(currentItems);
           $(".cartPrice").text(cartPrice);
       });
});

所以你可以看到数量更新完美但总价只有效一次

再次感谢

编辑:

我刚试过 cartPrice += cartPrice;但它每次都翻倍

Answer 1

你的代码最明显的问题是这一行:

cartPrice + cartPrice;

这不会执行任何操作，因为您没有分配结果。您将不得不执行以下任一操作:

cartPrice += cartPrice;
cartPrice = cartPrice + cartPrice;

但是，这会给您带来问题，因为您最终每次都会将价格翻倍。

解决办法是根本不应该改变cartPrice，否则你无法知道每件商品的成本以供后续计算。

而是创建一个局部变量并根据项目数量 * 项目成本计算它。像这样:

var currentItems = 0;
var cartPrice = 565.00;
$(document).ready(function(){
   $(".add-to-cart").click(function(){
       currentItems++;
       var totalPrice = currentItems * cartPrice;
       $(".cart-badge").text(currentItems);
       $(".cartPrice").text(totalPrice);
   });
});