如何在javascript中的购物车中添加数字并用小数点后的数字正确显示它们

问题描述

请帮助我，如何在JavaScript中像在电子商务购物车中一样添加多个数字并正确显示小数点后的数字？如果属性值data-price为2.50，我想在balance.innerHTML上将值显示为2.50，而不是显示为2.5。这是我的代码：

  <div class="row">

  <div class="col6">
  2,50$
  <div  onclick="addC(this)" data-price="2.50">
  Add to cart
  </div>
  </div>


  <div class="col6">
  2,40$
 <div onclick="addC(this)" data-price="2.40">
 Add to cart
 </div>
 </div>

 </div>

 <div id="balance" data-price="0">0</div>

function addC(product){

let balance = document.getElementById('balance');

balance.innerHTML = parseFloat(Number(balance.innerHTML).toFixed(2)) + parseFloat(Number(product.getAttribute('data-price')).toFixed(3));

}

在这种方法中，您能告诉我吗，因为我使用的是带小数点的数字，如何显示带小数点后两位的零。我想将它们显示为2,50和2,40并对它们求和，但是在DOM上当前的输出是2.5和2.4：

解决方法

在最终金额上而不是在加数上使用toFixed。

(2.4 + 2.5).toFixed(2)  --> yields "3.30"

attributes javascript numbers tofixed