【问题标题】:Calculate the sum of the time for column计算列的时间总和
【发布时间】:2013-06-13 15:19:19
【问题描述】:

我有这张桌子:

<table id="total" border="1" width="100%">
    <tbody>
        <tr>
            <td>Total duration time</td>
            <td class="total_duration_time"></td>
        </tr>
    </tbody>
</table>
<table id="data" border="1" width="100%">
    <tbody>
        <tr>
            <td>Anna</td>
            <td>318</td><td class="duration_time">00:00:50</td>
            <td>62700</td>
        </tr>
        <tr>
            <td>Bob</td>
            <td>318</td>
            <td class="duration_time">00:00:27</td>
            <td>62703</td>
        </tr>
        <tr>
            <td>Mike</td>
            <td>318</td>
            <td class="duration_time">00:00:36</td>
            <td>88455233284</td>
        </tr>
    </tbody>
</table>

我需要计算类 duration_time 的列的总和,并将结果打印到类 total_duration_time 的列中。

如何在 JavaScript 或 jQuery 上做到这一点?

我尝试使用此示例中的代码 http://jsfiddle.net/unKDk/13/,但如果用 00:00:00 类型的值代替数字代替,它不会计算时间量。

【问题讨论】:

  • 您将不得不手动解析时间。您可以使用正则表达式,或按: 拆分,然后自己计算
  • 这是我得到的:jsfiddle.net/5gXSm。它不计算结转 - 例如,如果秒数超过 60,它不应该变成 61 - 它应该增加分钟数并重置为 0。我将把它留给你跨度>

标签: javascript jquery


【解决方案1】:

最简单的方法是使用秒。我的意思是,您可以将每个持续时间转换为秒,计算总数,然后使用另一个将秒转换为 hh-mm-ss 格式的函数显示您需要的位置。

您可以查看它的外观和工作原理here

注意:函数toHHMMSS()采用here的形式

【讨论】:

  • 使用秒通常是计算时间的最佳选择,习惯它
  • 是的,这就是我所说的。当我们谈论时间时,是将价值保存在数据库中或玩弄的最佳方式
  • 谢谢!你对我帮助很大。
  • 简单而完美! ;)
  • 虽然这在理论上可以回答问题,it would be preferable 在这里包含答案的基本部分,并提供链接以供参考。
【解决方案2】:

这是一个带进位的完整示例(假设格式为 HOURS:MINUTES:SECONDS),这可能不是计算的最佳解决方案:

HTML

<table id="sum_table" width="300" border="1">
<tr class="titlerow">
    <td>Apple</td>
    <td>Orange</td>
    <td>Watermelon</td>
</tr>
<tr>
    <td class="rowDataSd">00:55:23</td>
    <td class="rowDataSd">00:55:23</td>
    <td class="rowDataSd">00:55:23</td>
</tr>
<tr>
    <td class="rowDataSd">00:55:23</td>
    <td class="rowDataSd">00:55:23</td>
    <td class="rowDataSd">00:55:23</td>
</tr>
<tr>
    <td class="rowDataSd">00:55:23</td>
    <td class="rowDataSd">00:55:23</td>
    <td class="rowDataSd">00:55:22</td>
</tr>
<tr class="totalColumn">
    <td class="totalCol">Total:</td>
    <td class="totalCol">Total:</td>
    <td class="totalCol">Total:</td>
</tr>
</table>

JS

var totals = [[0,0,0], [0,0,0], [0,0,0]];
$(document).ready(function () {

var $dataRows = $("#sum_table tr:not('.totalColumn, .titlerow')");

$dataRows.each(function () {
    $(this).find('.rowDataSd').each(function (i) {
        time = $(this).html().split(":")
        totals[i][2] += parseInt(time[2]);
        if(totals[i][2] > 60)
        {
            totals[i][2] %= 60;
            totals[i][1] += parseInt(time[1]) + 1;          
        }
        else
            totals[i][1] += parseInt(time[1]);

        if(totals[i][1] > 60)
        {
            totals[i][1] %= 60;
            totals[i][0] += parseInt(time[0]) + 1;          
        }
        else
            totals[i][0] += parseInt(time[0]);
    });
});
$("#sum_table td.totalCol").each(function (i) {
    console.log(totals[i]);
    $(this).html("total:" + totals[i][0] + ":" + totals[i][1] + ":" + totals[i][2]);
});

});

http://jsfiddle.net/unKDk/192/

【讨论】:

    【解决方案3】:

    您可以使用 24 小时格式的时间输入来计算总时间

    var a = "22:00"
    var b = "01:00"
    

    小提琴演示:

    Time Calculation Example, https://github.com/Zalasanjay

    【讨论】:

      【解决方案4】:

      你需要做这样的事情,我没有对它进行广泛的测试,所以可能会有问题,但你应该明白。

      Javascript

      var totalDurationTime = document.getElementsByClassName("total_duration_time")[0],
          durationTimes = document.getElementsByClassName("duration_time"),
          total = {
              hours: 0,
              minutes: 0,
              seconds: 0
          };
      
      function zeroPad (num) {
          var str = num.toString();
      
          if (str.length < 2) {
              str = "0" + str;
          }
      
          return str;
      }
      
      Array.prototype.forEach.call(durationTimes, function (time) {
          var parts = time.textContent.split(":"),
              temp;
      
          temp = (+parts[2] + total.seconds);
          total.seconds = temp % 60;    
          temp = (+parts[1] + total.minutes) + (temp - total.seconds) / 60;
          total.minutes = temp % 60;    
          total.hours = (+parts[0] + total.hours) + (temp - total.minutes) / 60;
      });
      
      totalDurationTime.textContent = zeroPad(total.hours) + ":" + zeroPad(total.minutes) + ":" + zeroPad(total.seconds);
      

      开启jsfiddle

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2014-01-04
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2021-10-05
        • 1970-01-01
        • 2020-01-02
        相关资源
        最近更新 更多