javascript 如何使用 td id Jquery 对所有表行 td (TotalPrice) 求和
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/33703125/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How To Sum All Table Rows td (TotalPrice) using td id Jquery
提问by Nabeel
I am adding values to table like: Item,Quantity,Price,TotalPrice
我正在向表中添加值，例如：Item、Quantity、Price、TotalPrice
Now there are multiple rows: How can i sum TotalPrice of all to get GrandTotal using Jquery.
现在有多行：我如何总结所有的 TotalPrice 以使用 Jquery 获得 GrandTotal。
Code:
代码：
$("#Product").append(" <tr><td id='clientname'>" +ClientName+ "</td> <td id='item'>"+ItemName+"</td> <td id='quantity'>"+Quantity+"</td> <td id='price'>"+Price+"</td> <td id='totalprice'>"+TotalPrice+"</td> <td> <a onClick='deleteRow(this);'>Delete</a> </td> </tr>");
Its possible when i insert new row data its show grand total in textbox/label,Like:
当我插入新行数据时，它可能会在文本框/标签中显示总计，例如：
function TotalPriceCalc()
{
var lblTotalPrice = document.getElementById('lblTotalPrice');
lblTotalPrice.value = sum;
}
采纳答案by Mohamed-Yousef
After you use class=instead of id=.Cause ID MUST be unique.you need to loop through each row and find totalPrice
在您使用class=而不是id=.Cause 之后，ID 必须是唯一的。你需要遍历每一行并找到 totalPrice
$(document).ready(function(){
var TotalValue = 0;
$("#Product tr").each(function(){
TotalValue += parseFloat($(this).find('.totalprice').text());
});
alert(TotalValue);
});
While you tagged Jquery .. This is a Jquery solution so please be sure to include Jquery
当您标记 Jquery .. 这是一个 Jquery 解决方案，因此请务必包含 Jquery
回答by Dave
Here's an example that will sum whatever column index you provide.
这是一个示例，它将对您提供的任何列索引求和。
$(function() {
$("#subtotal").html(sumColumn(4));
$("#total").html(sumColumn(5));
});
function sumColumn(index) {
var total = 0;
$("td:nth-child(" + index + ")").each(function() {
total += parseInt($(this).text(), 10) || 0;
});
return total;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table style="border-spacing: 10px;">
<tr>
<td>ClientName</td>
<td>ItemName</td>
<td>Quantity</td>
<td>12</td>
<td>34</td>
</tr>
<tr>
<td>ClientName</td>
<td>ItemName</td>
<td>Quantity</td>
<td>56</td>
<td>78</td>
</tr>
<tr>
<td>ClientName</td>
<td>ItemName</td>
<td>Quantity</td>
<td>90</td>
<td>12</td>
</tr>
<tr>
<td colspan="3">Totals</td>
<td id="subtotal"></td>
<td id="total"></td>
</tr>
</table>回答by Barmar
You should use classes, not IDs, to name repeated elements. So it should be:
您应该使用类而不是 ID 来命名重复的元素。所以应该是：
...<td class="totalprice">'+TotalPrice+'</td>...
Then you can do
然后你可以做
function TotalPriceCalc() {
var total = 0;
$(".totalprice").each(function() {
total += parseFloat($(this).text());
});
$("#lblTotalPrice").val(total);
}
