jQuery 输入字段中的总时间总和

Question

我需要 jQuery 自动给我输入字段中的时间总和。我希望它在另一个输入字段中显示总计，并将值设置为总时间。示例如下。

input 1: 18:30   //format mm:ss
input 2:  3:00 
input 3:  0:00
input 4:  0:30
------------------
Total:   22:00

Answer 1

下面的代码是实现相同目的的一种迂回方式。但是，如果您确实想要更好的方法，我建议您使用 Moments.js，它具有处理 javascropt/jquery

中日期时间的各种功能

var score = $('.input').val();
var minutes  = 0;
var seconds = 0;
var tmpSec = 0;
$(score).each(function(index){
    var minSec = this;
    var timeParts = minSec.split(":");
    minutes = minutes + parseInt(timeParts[0]);
    seconds = seconds + parseInt(timeParts[1]);
});
if (seconds > 60){
    tmpSec = Math.round(seconds / 60);
    seconds = seconds % 60;
}

tmpMins = minutes + parseInt(tmpSec);
finalOutput = tmpMins + ":" + seconds;

为简单起见，我假设你所有的输入框，除了结果框有一个 class "input"。您可以相应地修改它。

Answer 2

这样的事情可能会对你有所帮助 :) 在你复制粘贴代码之前，试着了解幕后发生的事情。

HTML

<input value="1:45" size="5">Time 1
<input value="1:30" size="5">Time 2
<input value="1:32" size="5">Time 3
<input value="5:30" size="5">Time 4
<button id="addTimes">Add times</button>
<br>Result<span id="timeSum"></span>

脚本

  Number.prototype.padDigit = function () {
        return (this < 10) ? '0' + this : this;
    }

 $("#addTimes").on('click', function () {
      var t1 = "00:00";
      var mins = 0;
      var hrs = 0;
        $('input').each(function () {
            t1 = t1.split(':');
            var t2 = $(this).val().split(':');
            mins = Number(t1[1]) + Number(t2[1]);
            minhrs = Math.floor(parseInt(mins / 60));
            hrs = Number(t1[0]) + Number(t2[0]) + minhrs;
            mins = mins % 60;
            t1 = hrs.padDigit() + ':' + mins.padDigit()

        });
        $('#timeSum').text(t1);
    });

Fiddle

仅供参考

split()

ParseInt

jQuery 输入字段中的总时间总和

jQuery sum of total time in input fields

time

jquery

sum

input