Question

我有一个表格，表格中存储了大约50个相似元素。

对于每个项目，我都有3条记录。

我已经这样提取了表中的元素：

    $table="SELECT * from hoa_list";
    $result=mysqli_query($db_conx,$table);
    $i=1;
    while($test = mysqli_fetch_array($result,MYSQLI_ASSOC))
        { ?>
    <tr>
    <td><input type="number" min="0" name="released[<?= $i ?>]" value="<?= $test['released']; ?>" onblur="recalculateSum();"></td>
    <td><input type="number" min="0" name="spent[<?= $i ?>]" value="<?= $test['spent']; ?>" onblur="recalculateSum();"></td>
    <td><input type="number" min="0" name="remain[<?= $i ?>]" value="<?= $test['remain']; ?>" readonly></td>
   </tr>
    <?php
    $i++;
           } ?>

对于每一行，我想计算第一元素和第二元素的差并将其动态显示在第3个只读输入中。对于没有数组的元素，我使用了以下代码

<script>
function recalculateSum()
{
    var num1 = parseInt(document.getElementById("released").value);
    var num2 = parseInt(document.getElementById("spent").value);
    total = document.getElementById("remain").value = num1 + num2;
}
</script>

任何人都可以帮助我计算表中存储的元素的差异，因为不可能进行每个元素的差异，因为行数超过50。我可以遍历第一个和第二个元素的任何代码计算其差值，然后移至下一行

Answer 1

您可以简单地将函数转换为循环。

function recalculateSum(count) {
  for (let i = 0; i < count; i++) {
    var num1 = parseInt(document.getElementById(`released${i}`).value)
    var num2 = parseInt(document.getElementById(`spent${i}`).value)
    total = document.getElementById(`remain${i}`).value = num1 + num2
  }
}

以数组的大小传递它，它将基于元素数进行计算。

Answer 2

您可以使用类似

function recalculateSum(){

var totalVal = 0;

$("#YouTableName tr").each(function(){

          totalValue += parseInt($(this).find('.Number1YouWantToAdd').val())+
          parseInt($(this).find('.Number2YouWantToAdd').val());

    });

return totalValue;
}

Answer 3

function recalculateSum(elem) {
  var parent = elem.parentNode.parentNode, // navigate up to the TR
    inputfields = parent.getElementsByTagName("input"); // get all inputs in that TR

  // parse values of field 0 and 1 into integers, assign sum to field 2
  inputfields[2].value = parseInt(inputfields[0].value) + parseInt(inputfields[1].value)

}

<table>
  <tr>
    <td><input type="number" min="0" name="released0" value="5" onblur="recalculateSum(this);"></td>
    <td><input type="number" min="0" name="spent0" value="7" onblur="recalculateSum(this);"></td>
    <td><input type="number" min="0" name="remain0" value="" readonly></td>
  </tr>
  <tr>
    <td><input type="number" min="0" name="released0" value="3" onblur="recalculateSum(this);"></td>
    <td><input type="number" min="0" name="spent0" value="47" onblur="recalculateSum(this);"></td>
    <td><input type="number" min="0" name="remain0" value=">" readonly></td>
  </tr>
</table>

计算存储为数组的输入的总和/差

3 个答案: