0

私は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>

この jQuery を使用して、class="amount" を 3 番目のセルに追加しています。

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

...意図したとおりに動作します。

私の目的は、複数のテーブルのそれぞれで jQuery に「金額」セルの合計を計算させ、その結果を指定されたセル (tr.total td.total) に表示させることです。非jQuerying javascripterの助けを借りて、これをまとめました：

// 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);

  });
 });

これは（明らかに）ページ内のすべての「金額」セルを合計し、すべての「合計」セルに書き込みます-閉じますが、明らかに、各合計をその親に表示する必要があることを正しく指定していません。私が欠けているものについて誰かが私をまっすぐにしてくれれば、私は大いに感謝しています.

乾杯、svs

4

2 に答える 2

0

これは私がこれを解決した方法です（不完全です）：

$(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);

    });
});

これは機能しますが、これまでのところ単一のテーブルに対してのみです。ページ内に複数の表がある場合はNGです。時間があるときに、この問題を再検討する必要があります。

貢献してくれた人たちにも同じように感謝します。

于 2011-09-29T17:19:40.397 に答える
0

Provide a class name for the td containing amount. and do something like this

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);
于 2010-02-24T04:22:25.150 に答える