Jquery 使用计算多个表中的列总数

我是jQuery的新手，但我过去曾设法拼凑出一些简单的脚本。我有一个新的挑战，我知道我已经进入了状态，但我需要一些帮助

我有一个html页面，其中有许多采用这种格式的表格：

<table class="tableClass" id="tableID">
  <col class="date" />
  <col class="reference" />
  <col class="amount" />
  <thead>
   <tr>
    <th class="date">Date</th>
    <th class="reference">Reference</th>
    <th class="amount">Amount</th>
   </tr>
  </thead>
  <tbody>
   <tr>
    <td>01-11-09</td>
    <td>text here</td>
    <td>33.66</td>
   </tr>
      <!—   [ etc., many more rows ]   -->

   <tr class="total">
    <td colspan="2">TOTAL:</td>
    <td class="amount total"></td>
   </tr>
  </tbody>
 </table>

日期
参考
数量
01-11-09
此处文本
33.66
总数：

我使用jQuery将class=“amount”添加到第三个单元格：

 <script type="text/javascript">
  $(document).ready(function(){
   $("tbody tr td:nth-child(3)").addClass("amount").append("<span>$<\/span>");
   });
 </script>

$（文档）.ready（函数（）{
$（“tbody tr td:nth child（3）”）.addClass（“amount”）.append（$）；
});

。。。它按预期工作

我的目标是让jQuery在多个表中计算“amount”单元格的总数，并在指定的单元格中显示结果（tr.total td.total）。在一位非jjava脚本编写人员的帮助下，我拼凑了以下内容：

// instantiate the 'total' variable
 var total = 0;
 var currTotal = 0.00;

 $(document).ready(function(){

  $('table').each(function(){

   // iterate through 3rd cell in each row in the tbody (td with an amount):
   $("#tableID tbody tr td:nth-child(3)").css("color", "red").each(function() {
    total += parseInt(100 * parseFloat($(this).text()));
   });

   currTotal = total/100;
   alert('Total = $ ' + currTotal);

   $(this).parent().find(".total .amount").html('<span>$<\/span>' + currTotal);

  });
 });

//实例化“total”变量
var合计=0；
var currTotal=0.00；
$（文档）.ready（函数（）{
$（'table'）。每个（函数（）{
//迭代tbody中每行的第3个单元格（td和金额）：
$（“#tableID tbody tr td:nth child（3）”）.css（“颜色”、“红色”）.each（函数（）{
total+=parseInt（100*parseFloat（$（this.text（））；
});
currTotal=总计/100；
警报（'Total=$'+currTotal）；
$（this.parent（）.find（“.total.amount”）.html（“$”+currototal）；
});
});

这（显然）合计页面中的所有“金额”单元格，并将其写入所有“总计”单元格-关闭，但显然我没有正确指定每个总计应显示在其父单元格中。如果有人能帮我澄清我所缺少的东西，我将不胜感激。如果有更简单的方法来完成剩下的事情，我洗耳恭听

---

Cheers，svs

为包含td的金额提供类名。然后像这样做

var totalAmount = 0.0;
$("#tableid td.classname").each ( function(){
    var currentAmount = parseFloat ( $(this).text());
    // if your td text contains $ symbol at the beginning you can do like this
    //var currentAmount = parseFloat ( $(this).text().substring(1));
    totalAmount += currentAmount; 
});

$("spanid").text(totalAmount);

---

这就是我解决这个问题的方法（不完美）：

$（文档）.ready（函数（）{
//1.选择除最后一行外的所有单元格中的最后一个，添加“金额”类别和美元符号：
$（“tr:not（：last）td:last child”）.addClass（“amount”）.append（$”；
//2.选择最后一行的最后一个单元格，添加“total amount”类别和美元符号：
$（“tr:last td:last child”）.addClass（“总额”）。追加（$”；
$（'table'）。每个（函数（）{
//实例化“total”变量
var总和=0；
var sumTotal=0.00；
//遍历每行中的“金额”单元格：
$（“td.amount”）。每个（函数（）{
sum+=parseInt（100*parseFloat（$（this.text（））；
总和=总和/100；
//警报（总计）；
});
美元（“.总额”）。追加（合计）；
});
});

这是可行的，但到目前为止只适用于一张桌子；当页面中有多个表时，它是NG。当我有时间的时候，我将不得不重新讨论这个问题

---

同样感谢那些做出贡献的人，非常感谢。

谢谢rahul，但我真的不明白这一点。我已经尝试过了，并更新了与我的html匹配的类，但没有乐趣。顺便说一句，您首先建议提供一个类名；每一行的第三行，每一个jQuery的第一个块，都有一个class=“amount”。我认为这里比较棘手的部分是，对多个表中的每个表都有一个唯一的计算，因此，在我之前的尝试中，“each”函数是针对表的，然后在每个循环中，我指定要循环通过/总计的单元格。。。

$(document).ready(function(){

    //  1. select the last cell in all but the last row, add the 'amount' class and the dollar sign:
    $("tr:not(:last) td:last-child").addClass("amount").append("<span>$<\/span>");

    //  2. select the last cell in the last row, add the 'total-amount' class and the dollar sign:
    $("tr:last td:last-child").addClass("total-amount").append("<span>$ <\/span>");


    $('table').each(function(){

        // instantiate the 'total' variable
        var sum = 0;
        var sumTotal = 0.00;

        // iterate through 'amount' cells in each row:
        $("td.amount").each(function() {
            sum += parseInt(100 * parseFloat($(this).text()));
            sumTotal = sum/100;
//          alert(sumTotal);
        });

        $('.total-amount').append(sumTotal);

    });
});