显示带 2 个小数位的总计

Question

我正在制作一家餐厅的在线菜单，需要在客户向菜单中添加项目时显示总数。但是，我的总数只更新为小数点后一位。我正在尝试使用 toFixed(2) 但无法正常工作。

var banquetPrice = parseInt($(document).find(".menuChoice").val());
$(".menuChoice").change(function () {
updateTotal()
});
var total = (banquetPrice * numGuests) + (9.25 * numGuac) + (9.25 * numQuesa) + (9.25 * numNachos)

$("#total").html(total);
total.toFixed(2);

如有任何帮助，我们将不胜感激！

Answer 1

给你伙计..

var total = (12.35 * 5) + (9.25 * 1) + (9.25 * 1) + (9.25 * 1)

$("#total").html(total.toFixed(2));

label{
border-bottom : 2px solid green;
font-weight: 900;
font-size: 32px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<label id="total" ></label>
</div>

Answer 2

如上面评论所述，您应该在更新 #total 元素文本的同一行调用 total.toFixed(2)。您目前丢弃 toFixed 的 return 值而不是使用它。使用性能更高的 .text() 而不是 .html()，该行现在变为：

$("#total").text(total.toFixed(2))

演示：

$(".menuChoice").change(updateTotal)

updateTotal()

function updateTotal() {
  // Assuming that these variables are already
  // defined and set to meaningful values
  var numGuests = 1
  var numGuac = 1
  var numQuesa = 1
  var numNachos = 1
  
  var banquetPrice = +$(".menuChoice").val()
  var total = (banquetPrice * numGuests) + (9.25 * numGuac) + (9.25 * numQuesa) + (9.25 * numNachos)
  $("#total").text(total.toFixed(2))
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p>Menu Choice: <input class="menuChoice" value="0"/>
<p>Total: $<span id="total"></span></p>

显示带 2 个小数位的总计

Showing Total with 2 Decimal Places

javascript

jquery

tofixed

演示：