計算總計使用javascript

Question

我不知道如何獲得總計價值

總計是所有總

這裏總和是代碼

<?php 
$con = mysqli_connect('localhost', 'root', '', 'a.karat'); 
if(isset($_POST['product_id'])) 
{ 
$prno=$_POST['prno']; 
$i=1; 
$sql = mysqli_query($con,"select * from detail_pr where prNo='$prno'"); 
while ($r = mysqli_fetch_array($sql)) { 

    echo 

    '<tr> 
<td><input type="checkbox" name="check[]" id="check'.$i.'" value="'.$i.'"></td> 
<td><label for="productCode"></label> 
    <input type="text" name="productCode'.$i.'" id="productCode'.$i.'" readonly value="'.$r["productCode"].'" size="12" ></td> 
<td><label for="productName"></label> 
    <input type="text" name="productName'.$i.'" id="productName'.$i.'" readonly value="'.$r["productName"].'"size="35" ></td> 
<td><label for="qty"></label> 
    <input type="number" onkeyup="calc(this);" name="qty'.$i.'" id="qty'.$i.'" readonly value="'.$r["qty"].'" size="8" ></td> 
<td><input type="number" onkeyup="calc(this);" name="price'.$i.'" id="price'.$i.'" size="10" min="1" max="99" onchange="calc(this);" ></td> 
<td><input type="number" onkeyup="calc(this);" name="discount'.$i.'" id="discount'.$i.'" size="10" min="0" max="99" onchange="calc(this);"></td> 
<td><input type="number" name="total'.$i.'" id="total'.$i.'" size="10" min="1" max="99" onchange="calc(this);" ></td> 
    </tr>'; 
    $i++; 
    } 
} 
?> 


<table width="400" border="0" align="right"> 
    <tr> 
    <th scope="row">Grand Total</th> 
    <td>:</td> 
    <td><input name="grandtotal" id="grandtotal" type="text"></td> 
    </tr> 
</table> 

<script> 
    function calc(id) { 
    var row = id.parentNode.parentNode; 
    var quant = row.cells[3].getElementsByTagName('input')[0].value; 
    var price = row.cells[4].getElementsByTagName('input')[0].value; 
    var disc = row.cells[5].getElementsByTagName('input')[0].value; 
    if (disc == null || disc == '') { 
    res = parseFloat(quant) * parseFloat(price); 
    } else { 
    var res = (parseFloat(quant) * parseFloat(price)) - (parseFloat(quant) *  parseFloat(price) * (parseFloat(disc)/100)); 
    } 
    row.cells[6].getElementsByTagName('input')[0].value = res; 
} 
</script> 

我必須設法計算每行總數

現在我需要你的幫助來總計所有總數並把它放在grandtotal文本框中

Answer 1

我想你的表單中的一個輸入元素的值的每次變化都應該更新總計，對不對？我會在窗體標籤上放置一個事件監聽器來保持簡單。

<form id="your-form" method="post" action=""> 
    <!-- All your other inputs here --> 
    <input type="text" name="grandtotal" id="grandtotal"> 
</form> 

<script> 
    document.querySelector('#your-form').addEventListener('change', function(event) { 
     if (event.target.id && event.target.id !== 'grandtotal') { 
      var allTotals = document.querySelectorAll('input[name^="total"]'), 
       allTotalSum = 0; 

      Array.prototype.forEach.call(allTotals, function(element) { 
       if (element.value) { 
        allTotalSum += parseFloat(element.value); 
       } 
      }); 

      document.querySelector('#grandtotal').value = allTotalSum; 
     } 
    }); 
</script> 

因此，對您的輸入字段的每次更改都會更新總和。此代碼未經測試。