如何在Jquery Datatable底部添加合计单元

在Jquery Datatable底部添加合计单元，可以通过以下步骤实现：

首先，确保你已经引入了Jquery和Datatable的相关库文件。
创建一个HTML表格，并给表格添加一个唯一的ID，例如：

<table id="myTable">
  <thead>
    <tr>
      <th>列1</th>
      <th>列2</th>
      <th>列3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>数据1</td>
      <td>数据2</td>
      <td>数据3</td>
    </tr>
    <!-- 其他数据行 -->
  </tbody>
</table>

使用Jquery初始化Datatable，并配置底部合计行的相关选项，例如：

$(document).ready(function() {
  $('#myTable').DataTable({
    "footerCallback": function (row, data, start, end, display) {
      var api = this.api();
      $(api.column(0).footer()).html('合计');
      // 计算每列的合计值
      var column1Total = api.column(1, {page: 'current'}).data().sum();
      var column2Total = api.column(2, {page: 'current'}).data().sum();
      // 在底部合计行显示合计值
      $(api.column(1).footer()).html(column1Total);
      $(api.column(2).footer()).html(column2Total);
    }
  });
});

在上述代码中，footerCallback函数用于在底部合计行中显示合计值。通过this.api()获取Datatable的API实例，然后使用column().footer()方法获取底部合计行的单元格元素，并使用html()方法设置合计值。
在上述代码中，我们使用了sum()方法来计算每列的合计值。请注意，sum()方法是自定义的，需要在代码中定义。以下是一个简单的实现示例：

$.fn.dataTable.Api.register( 'sum()', function () {
    return this.flatten().reduce( function ( a, b ) {
        if ( typeof a === 'string' ) {
            a = a.replace(/[^\d.-]/g, '') * 1;
        }
        if ( typeof b === 'string' ) {
            b = b.replace(/[^\d.-]/g, '') * 1;
        }
        return a + b;
    }, 0 );
} );