Question

我正在使用jQuery数据表，我需要一个时间总和（hh：mm：ss）列。

我正在使用sum（）插件（https://cdn.datatables.net/plug-ins/1.10.11/api/sum%28%29.js）添加列数据，我真的不知道它是如何工作的。

    db.coll2.insert(
      db.coll1.aggregate([]).toArray()
    )

这给了我这个输出，这是一个总和，但它需要一些调整，我无法弄清楚如何改变：

进入： 12:03:05 （正确的总和输出）。

请帮忙。

Answer 1

正如您在plugin source中看到的，它首先将字符串单元格内容转换为数字，然后执行添加。您应该通过解析格式化的值HH：MM：SS（例如通过正则表达式）来扩展单元格值的处理，然后将其转换为以秒为单位的时间间隔（HH * 24 + MM * 60 + SS），然后将这些值相加，然后将其转换回小时/分钟/秒。

您可以像这样更新sum功能：

jQuery.fn.dataTable.Api.register( 'sum()', function ( ) {
    return this.flatten().reduce( function ( a, b ) {

        var timeRegexp = /^(\d{2}):(\d{2}):(\d{2})$/

        var matches = a.match(timeRegexp);
        if (matches) {
            var hh = matches[1], mm = matches[2], ss = matches[3];
            var intervalAsSeconds = hh * 24 + mm * 60 + ss;
            return b + intervalAsSeconds;
        }

        if ( typeof a === 'string' ) {
            a = a.replace(/[^\d.-]/g, '') * 1;
        }
        if ( typeof b === 'string' ) {
            b = b.replace(/[^\d.-]/g, '') * 1;
        }

        return a + b;
    }, 0 );
} );

要将总和（以秒为单位）转换回HH：MM：SS，您可以使用以下功能：

function secondsToTime(seconds) {
  var hours = Math.floor(seconds / 3600);
  var minutes = Math.floor((seconds % 3600) / 60); 
  var seconds = Math.floor(seconds % 60);
  return (hours < 10 ? "0" + hours : hours) + ":" + 
         (minutes < 10 ? "0" + minutes : minutes) + ":" + 
         (seconds < 10 ? "0" + seconds : seconds);
}

反向转换的一些示例：

console.log(secondsToTime(45)) // 00:00:45
console.log(secondsToTime(125)) // 00:02:05
console.log(secondsToTime(3600)) // 01:00:00
console.log(secondsToTime(3725)) // 01:02:05

Answer 2

<script type="text/javascript" language="javascript">

var table = $('#example').DataTable({
"footerCallback": function ( row, data, start, end, display ) {
    var api = this.api(), data;
    // Total over all pages
    total_ID = api.column(0).data().reduce( function (a, b) {
        return ~~a + ~~b;
    }, 0 );
    total_Duration = api.column(1).data().reduce( function (a, b) {
        return moment.duration(a).asMilliseconds() + moment.duration(b).asMilliseconds();
    }, 0 );
    // Total over this page
    pageTotal_ID = api.column(0, { page: 'current'} ).data().reduce( function (a, b) {
        return ~~a + ~~b;
    }, 0 );
    pageTotal_Duration = api.column(1, { page: 'current'} ).data().reduce( function (a, b) {
        return moment.duration(a).asMilliseconds() + moment.duration(b).asMilliseconds();
    }, 0 );
    // Update footer Column "quantita"
    $( api.column(0).footer()).html(
        pageTotal_ID + ' ('+ total_ID +' total)'
    );
    $( api.column(1).footer()).html(
        moment.utc(pageTotal_Duration).format("HH:mm:ss") + ' ('+ moment.utc(total_Duration).format("HH:mm:ss") + ' total)'
    );
}   
});
</script>

Answer 3

此解决方案适用于Pranav C Balans 's answer。

public class ChangingFaceTester{
 public static void main(String[] args){
  new ChangingFace();
  new ChatBot();
 }
}

Answer 4

在这种情况下，我会有点棘手。使用time创建隐藏列，但仅创建seconds。现在，我可以使用此列来计算total并将其转换回所需的格式。

    $('#tblTime').DataTable({
    "footerCallback": function (row, data, start, end, display) {

        var api = this.api();

        //convert seconds to hour:minute:seconds
        var secondsToHms = function(d) {
          d = Number(d);
          var h = Math.floor(d / 3600);
          var m = Math.floor(d % 3600 / 60);
          var s = Math.floor(d % 3600 % 60);

          return h + ":" + m + ":" + s;
        };

        //sum of hidden colunm hours in seconds
        var sum_hours_estimated = api
          .column( 2 ) //hidden column
          .data()
          .reduce( function (a, b) {
              return intVal(a) + intVal(b);
        }, 0 );

        //covert the seconds into hour.minute
        var hours_estimated = secondsToHms(sum_hours_estimated);   

        var summary = '<ul><li>Total Time ' + hours_estimated + '</li><ul>';
        $(api.column(1).footer()).html(summary);
    },
    //hide the column
    "columnDefs": [
        {
            "targets": [ 2 ],
            "visible": false,
            "searchable": false
        }
    ]
});

//Use this if "columnDefs" doesn't work
$('#tblTime').DataTable().column( 2 ).visible( false );

Answer 5

我遇到了dsame问题，并且找到了适合我的解决方案：

footerCallback: function ( row, data, start, end, display ) {
        var api = this.api(), data;

        var intVal = function ( i ) {
            return i != null ? moment.duration(i).asSeconds() : 0;
        };

        var total = api.column( 3 ).data()
            .reduce( function (a, b) {
            var total = intVal(a) + intVal(b);
            var totalFormatted = [
                parseInt(total / 60 / 60),
                parseInt(total / 60 % 60),
                parseInt(total % 60)
            ].join(":").replace(/\b(\d)\b/g, "0$1");
            return totalFormatted;
        }, 0 );

        jQuery(api.column( 3 ).footer()).html(total);
    }
});

jQuery数据表列sum（）hh：mm：ss

5 个答案: