如何在项目复选框中包含 javascript，以便所选框自动计算价格值？答案

【问题标题】：How do include javascript to item checkbox so that the selected box calculates the price value automatucally?如何在项目复选框中包含 javascript，以便所选框自动计算价格值？
【发布时间】：2021-08-28 19:50:15
【问题描述】：

显示四个或更多要购买的商品及其相应的购买价格（使用复选框来选择您要购买的商品）。将复选框命名为 item_0、item_1 等。包括一个总计字段，当每个项目被选中/取消选中或指定数量发生变化时，该字段会自动汇总您的购买。将此字段命名为总计。

我需要一些帮助。

这是迄今为止我能做的最简单的代码。

<h3> Cart </h3>
<input type = "checkbox" id = "item_0" name ="item_0" value = "Malt">
<label> Beta Malt </label>
<input type = "checkbox" id = "item_1" name ="item_1" value = "bread">
<label> A1 Bread </label>
<input type = "checkbox" id = "item_0" name ="item_2" value = "noodles">
<label> Indomie </label>
<input type = "checkbox" id = "item_0" name ="item_3" value = "milk">
<label> Cowbell </label>

【问题讨论】：

那是 html。你试过的javascript在哪里？总元素在哪里？人们愿意提供帮助，但大多数人不想为你做功课。
您应该在某处添加价格，可能作为输入值。然后你可以监听 change 事件并使用 event.target.value 对值做一些事情。见developer.mozilla.org/en-US/docs/Web/API/HTMLElement/…

标签： javascript html forms class flexbox

【解决方案1】：

首先，更改相同的属性名称。例如，您可以使用How to check multiple checkboxes with JavaScript?。使用这个想法。

var checkboxes = document.querySelectorAll('input[name="' + nameCheckbox + '"]:checked'), values = 0;
    Array.prototype.forEach.call(checkboxes, function(el) {
        values += parseInt(el.value);
    });

警报（值）；

【讨论】：