Javascript 添加小时数以获取结果的总小时数

我在这里找到了这个代码 这个怎么样

我用一个文本框替换了标签，并为“时间”文本框添加了一个

input

事件侦听器。无论何时更改任何一个时间文本框，都将重新计算时间

Html:

function grand_total(){
  var t1 = "00.00";
  var mins = 0;
  var hrs = 0;
    $(".cl_tot_st").each(function () {
        t1 = t1.split('.');
        var t2 = $(this).val().split('.');
        console.log(Number(t1[1]) + Number(t2[1]))
        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()
        console.log(t1)
    });
    $('#gtot_st').text(t1);
};

时间1


时间2


时间3


时间4

增加次数


结果

Javascript/JQuery

<input id="time1" value="1.45" size="5" class="time">Time 1
<br>
<input id="time2" value="1.30" size="5" class="time">Time 2
<br>
<input id="time2" value="1.32" size="5" class="time">Time 3
<br>
<input id="time2" value="5.30" size="5" class="time">Time 4

<br><button id="addTimes">Add times</button>
<br><br>Result<span id="timeSum"><input type ="text" id="gtot_st"></span>

<br>

Number.prototype.padDigit=函数（）{
返回值（this<10）“'0'+this:this；
}
函数计算器总计（）{
var t1=“00.00”；
var-mins=0；
var-hrs=0；
$（'input.time'）。每个（函数（）{
t1=t1.分裂（'.'）；
var t2=$（this.val（）.split（'.'）；
控制台日志（编号（t1[1]）+编号（t2[1]））
分钟=数字（t1[1]）+数字（t2[1]）；
minhrs=数学楼层（parseInt（分钟/60））；
小时数=数量（t1[0]）+数量（t2[0]）+分钟小时数；
分钟=分钟%60；
t1=hrs.padDigit（）+'.+mins.padDigit（）
控制台日志（t1）；
});
返回t1；
}
$（“#addTimes”）。在（'click'，函数（）{
$（'gtot_st'）.val（CalculateTotal（））；
});
//检查任何一个“时间”类文本框上的输入更改
$（“.time”）.on（'input'，function（）{
$（'gtot_st'）.val（CalculateTotal（））；
})

如何运行

grand_total（）

？添加

onclick=grand_total（）

，这样函数就可以工作了。但是我需要它，就像在一个文本框中输入值时，grandtotal会自动显示在gtot st文本框中一样。也许你应该在问题中提到这一点？您需要监听输入值中的更改。例如，使用

onchange=grand_total（）

进行输入。我可以使用“.”而不是“：”吗？

<input id="time1" value="1.45" size="5" class="time">Time 1
<br>
<input id="time2" value="1.30" size="5" class="time">Time 2
<br>
<input id="time2" value="1.32" size="5" class="time">Time 3
<br>
<input id="time2" value="5.30" size="5" class="time">Time 4

<br><button id="addTimes">Add times</button>
<br><br>Result<span id="timeSum"><input type ="text" id="gtot_st"></span>

<br>

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

function CalculateTotal() {
  var t1 = "00.00";
  var mins = 0;
  var hrs = 0;
  $('input.time').each(function () {
    t1 = t1.split('.');
    var t2 = $(this).val().split('.');
    console.log(Number(t1[1]) + Number(t2[1]))
    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()
    console.log(t1);
  });
  return t1;
}

$("#addTimes").on('click', function () {
  $('#gtot_st').val(CalculateTotal());
});

//Check for an input change on any one of the text boxes with a class of "time"
$(".time").on('input', function() {
    $('#gtot_st').val(CalculateTotal());
})