html JavaScript -需要合计输入中所有行的总价之和，但它将值连接在一起，而不是相加

brjng4g3 于 2022-11-20 发布在 Java

关注(0)|答案(3)|浏览(122)

我想把所有行的总价加起来。但是它不能把值加起来，它只是把值连接起来。下面是生成HTML的PHP：

$counter = 0;

foreach($db->getRecordSet($sqlTrRecord) as $row){$counter += 1; ?>
    <tr id="temTr" class="banktblhd">
      <td width="5"> <?php echo($counter); ?> </td>

      <td class="w10"> <input type="number" name="item_code" id="item_code" class="form-control" value="<?php echo($row['item_code']); ?>" readonly  /></td>
      <td class="w10"><input type="text" class="form-control" name="item_name" id="item_name" value="<?php echo($row['item_name']); ?>" readonly /> </td>
      <td class="w10"><input type="text" class="form-control" name="description" id="description" value="<?php echo($row['description']); ?>" readonly /></td>
      <td class="w10"><input type="number" class="form-control" name="availableQty" id="availableQty" value="<?php echo($row['quantity']); ?>" readonly  /></td>
      <td class="w10"><input type="number" class="form-control" name="p_cost" oninput="total(this);" id="p_cost" value="<?php echo($row['p_cost']); ?>" readonly /></td>
      <td class="w10">
        <input type="number" oninput="total(this);" class="form-control" name="quantity" id="quantity" autocomplete="off" /> </td>
      <td class="w10">
        <input type="number" oninput="total(this);" class="form-control" name="sale" id="sale" autocomplete="off" /> </td> 
      <td class="w10"><input type="number" oninput="total(this)" class="form-control" name="total_price" id="total_price" readonly />
      </td>
      <td class="w10" colspan="2"><input type="number" class="form-control"  name="total" id="total" readonly /></td>

下面是我JavaScript：

function total(element) {
    var row = element.closest("tr");
    var unitRate = row.querySelector("input[name=p_cost]");
    var qty = row.querySelector("input[name=quantity]");
    var sale = row.querySelector("input[name=sale]");

    var total_price = parseFloat(unitRate.value * qty.value) + parseFloat(sale.value);
    var total = row.querySelector("input[name=total_price]").value = total_price;

    document.getElementById("total").value += total;
}

Html

来源：https://stackoverflow.com/questions/48240695/javascript-need-sum-of-total-price-from-all-rows-in-total-input-but-it-concate

3条答案

按热度按时间

lf5gs5x21#

首先，需要从输入字段中获取一个字符串，然后需要将该字符串类型转换为整数，因为默认情况下它是作为字符串选取的
解决方案：parseInt(value)
let num = parseInt(value)
之后，num变量可以添加到任何数字类型的变量中。并且它将开始工作。

赞(0）回复(0）举报 2022-11-20

6ju8rftf2#

您可以使用document.getElementById("total").valueAsNumber，因为document.getElementById("total").value会以字串形式提供

赞(0）回复(0）举报 2022-11-20

chhkpiq43#

在你的代码里，你说

document.getElementById("total").value += total;

这与

document.getElementById("total").value = document.getElementById("total").value + total;

现在document.getElementById("total").value是一个文本值，所以第一个操作数是文本，第二个操作数被转换为文本，这就是为什么你会得到连接（在控制台中尝试"2"+2和var a = "2"; a+=2）。

document.getElementById("total").value = parseFloat(document.getElementById("total").value) + total;

但实际上我觉得你需要

document.getElementById("total").value = parseFloat(document.getElementById("total").value) + total_price;

并且根本不需要创建另一个var（total）（为什么需要它？）
实际上，我认为您需要（而不是total函数的最后3行[伙计，它应该是getTotal，不要这样命名函数！]）：

var total_price = parseFloat(unitRate.value * qty.value) + parseFloat(sale.value);
row.querySelector("input[name=total_price]").value = total_price;
var prevTotal = parseFloat(document.getElementById("total").value);
document.getElementById("total").value = prevTotal + total_price;

其实这似乎也不是什么好主意：当前total函数在输入时被调用，因此当输入1时，总数会增加1，当继续输入10时，会再增加10**，得到11。如果他们更改了值，处理程序将添加新值，并保留以前的值。每次都必须重新计算总数！

赞(0）回复(0）举报 2022-11-20

我来回答

html JavaScript -需要合计输入中所有行的总价之和，但它将值连接在一起，而不是相加

3条答案

相关问题

热门标签

最新问答