如何使用jquery从表格单元格计算总计

时间:2010-08-17 12:29:58

标签: javascript jquery

这是我的HTML表格格式:

<table width="580" height="217" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td width="334">Product</td>
    <td width="246">Price</td>
  </tr>
  <tr>
    <td>Product One</td>
    <td class="price">599</td>
  </tr>
  <tr>
    <td>Product Two</td>
    <td class="price">175</td>
  </tr>
  <tr>
    <td>Product Three</td>
    <td class="price">850</td>
  </tr>
  <tr>
    <td>Product Four</td>
    <td class="price">758</td>
  </tr>
</table>

<p id="grandtotal"></p>

现在,我如何计算所有产品的总计并将其显示在ID为“grandtotal”的段落中?

注意:该表是动态生成的,这仅适用于演示。

编辑:为价格添加了类价:),希望这有帮助。

2 个答案:

答案 0 :(得分:6)

根据您的更新(和Jamiec解决方案),您可以执行以下操作:

var sum = 0;
$('.price').each(function() {
    sum += parseFloat($(this).text());
});
$('#grandtotal').html(sum)

答案 1 :(得分:2)

以下代码有效:

var sum = 0;
$('tr:not(:first)').each(function(){
    sum += parseFloat($('td:eq(1)',$(this)).text());
});

$('#grandtotal').html(sum)

但是,通过更改标记以将标题放在thead节点中(取消not(:first))并在单元格上放置一个表示“价格”列的类,可以使这更简单。< / p>

编辑:忘记了必须的jsfiddle - &gt; http://jsfiddle.net/S5Hbe/