迭代 DataTable() 以获取每一行的 td 值

Question

我用 DataTable() 插件创建了一个表：DataTable

每一行都有一个带有“数量”类的 td。 我想迭代所有行以获取所有 td 值并将总和保存到变量中。

找到了这个：each()，但是不知道怎么集成。

UPDATE：DataTable()生成的代码

<table id="table">
    <thead>
        <tr>
            <th>a</th>
            <th>b</th>
            <th>c</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Hello</td>
            <td>World</td>                              
            <td class="amount">346.387,81</td>
        </tr>
        <tr>
            <td>Hello</td>
            <td>World</td>                              
            <td class="amount">444.392,35</td>
        </tr>
    </tbody>
</table>

Answer 1

你可以使用：

var totalamount = 0;
$('#table td.amount').each(function(){
   totalamount += parseFloat($(this).text().replace(",",""),10)
});

Working Demo

Answer 2

在their documentation 中，有一个示例完全符合您的要求。

看看下面的sn-p：

$(function() {
  $('#example').DataTable({
    footerCallback: function(row, data, start, end, display) {
      var api = this.api();

      function intVal(i) {
        return typeof i === 'string' ?
          i.replace(/[\$,]/g, '') * 1 :
          typeof i === 'number' ?
          i : 0;
      };

      // Total over this page
      var total = api
        .column(1, {
          page: 'current'
        })
        .data()
        .reduce(function(a, b) {
          return intVal(a) + intVal(b);
        });

      // Update footer
      $(api.column(1).footer()).html(
        total
      );
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
<link href="//cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css" rel="stylesheet" />

<table id="example" class="display" cellspacing="0" width="80%">
  <thead>
    <tr>
      <th>Name</th>
      <th>Amount</th>
    </tr>
  </thead>

  <tfoot>
    <tr>
      <th>Name</th>
      <th>Amount</th>
    </tr>
  </tfoot>

  <tbody>
    <tr>
      <td>Tiger Nixon</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Garrett Winters</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>Ashton Cox</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Cedric Kelly</td>
      <td>433,060</td>
    </tr>
</table>

Answer 3

这将解析整个数据集并返回总数：

$(document).ready(function() {
  console.clear();
  var oTable = $('#example').dataTable();
  var rows = oTable.fnSettings().aoData;
  var columnIndex = 1;
  var total = 0;

  $.each(rows, function(i, val) {
    total += parseFloat(val._aData[columnIndex].replace(/,/g, ""));
  });

  alert(total);
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.datatables.net/1.10.9/js/jquery.dataTables.min.js"></script>
<link href="https://cdn.datatables.net/1.10.9/css/jquery.dataTables.min.css" rel="stylesheet" />


<table id="example" class="display" cellspacing="0" width="80%">
  <thead>
    <tr>
      <th>Name</th>
      <th>Amount</th>
    </tr>
  </thead>

  <tfoot>
    <tr>
      <th>Name</th>
      <th>Amount</th>
    </tr>
  </tfoot>

  <tbody>
    <tr>
      <td>Tiger Nixon</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Garrett Winters</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>Ashton Cox</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Cedric Kelly</td>
      <td>433,060</td>
    </tr>
    <tr>
      <td>Tiger Nixon</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Garrett Winters</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>Ashton Cox</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Cedric Kelly</td>
      <td>433,060</td>
    </tr>
    <tr>
      <td>Tiger Nixon</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Garrett Winters</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>Ashton Cox</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Cedric Kelly</td>
      <td>433,060</td>
    </tr>
    <tr>
      <td>Tiger Nixon</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Garrett Winters</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>Ashton Cox</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Cedric Kelly</td>
      <td>433,060</td>
    </tr>
    <tr>
      <td>Tiger Nixon</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Garrett Winters</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>Ashton Cox</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Cedric Kelly</td>
      <td>433,060</td>
    </tr>
    <tr>
      <td>Tiger Nixon</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Garrett Winters</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>Ashton Cox</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Cedric Kelly</td>
      <td>433,060</td>
    </tr>
    <tr>
      <td>Tiger Nixon</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Garrett Winters</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>Ashton Cox</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Cedric Kelly</td>
      <td>433,060</td>
    </tr>
    <tr>
      <td>Tiger Nixon</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Garrett Winters</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>Ashton Cox</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Cedric Kelly</td>
      <td>433,060</td>
    </tr>
    <tr>
      <td>Tiger Nixon</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Garrett Winters</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>Ashton Cox</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Cedric Kelly</td>
      <td>433,060</td>
    </tr>
    <tr>
      <td>Tiger Nixon</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Garrett Winters</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>Ashton Cox</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Cedric Kelly</td>
      <td>433,060</td>
    </tr>
    <tr>
      <td>Tiger Nixon</td>
      <td>320,800</td>
    </tr>
    <tr>
      <td>Garrett Winters</td>
      <td>170,750</td>
    </tr>
    <tr>
      <td>Ashton Cox</td>
      <td>86,000</td>
    </tr>
    <tr>
      <td>Cedric Kelly</td>
      <td>433,060</td>
    </tr>
</table>