我有一个HTML表格,用于计算用户输入的工作时间。
我遇到的问题是弄清楚如何让计算器在计算总工时时考虑分钟。
例如,用户在Standby Start time
中输入24-hour format
。我们说他们输入了00:30
,而在Standby End Time
,他们会输入4:20
,结果会在3:50
文字中显示Hours in total
领域。现在它只显示4
小时。
以下是代码:
var numRows = 2,
ti = 5;
var tableCount = 1;
var index = 1;
window.standBy = function() {
var sum = 0;
$(".Standby").each(function(index, stand) {
sum += parseFloat($(stand).val());
})
$(".grandtotal").val(sum)
}
function calculate() {
var tr = $(this).closest('tr'),
startTime = $('.Time1').val(),
endTime = $('.Time2').val();
if (startTime === '' || endTime === '') {
return;
}
var hours = parseInt(endTime.split(':')[0], 10) - parseInt(startTime.split(':')[0], 10);
if (hours < 0) hours = 24 + hours;
$(".Hours", tr).val(hours);
if (hours >= 4) $(".Standby", tr).val("1");
if (hours <= 4) $(".Standby", tr).val("0.5");
//if (hours==4 && hours<8) $(".Standby").val("1");
if (hours >= 8 && hours <= 12) $(".Standby", tr).val("1.5");
if (hours > 12) $(".Standby", tr).val("1.5");
}
$('#table').on('input', ".Time1,.Time2", calculate);
$('#table').find(".Time1").trigger('change')
window.addTime = function() {
tableCount++;
$('#timeTable').clone().attr('id', "timeTable" + tableCount).appendTo('#table');
$('#timeTable' + tableCount).find("input").val("");
index++;
$('#timeTable' + tableCount + ' .aa').html(tableCount);
};
$(document).on('click', 'button.removeTime', function() {
var closestTable = $(this).closest('table');
if (closestTable.attr('id') != "timeTable") {
closestTable.remove();
}
tableCount--;
if (tableCount < 1) {
tableCount = 1;
}
return false;
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<h1>
Time format is in 24h
</h1>
<div id="table">
<table id="timeTable" class="tg">
<tr>
<th class="tg-yw41"></th>
<th class="tg-yw41"></th>
<th class="tg-yw4l">Start time</th>
<th class="tg-yw4l">End time</th>
<th class="tg-yw4l">Hours in total</th>
<th class="tg-yw4l">Standby hours</th>
</tr>
<tr>
<td class="aa">1</td>
<td class="tg-yw4l"><button class="removeTime">Remove Time</button></td>
<td class="tg-yw4l">
<input class="Time1" value="" placeholder="Enter your start time" />
</td>
<td class="tg-yw4l">
<input class="Time2" value="" placeholder="Enter your end time" />
</td>
<td class="tg-yw4l">
<input type="text" class="Hours" value="0" readonly="" />
</td>
<td class="tg-yw4l">
<input type="text" class="Standby" value="0" readonly="" />
</td>
</tr>
</table>
</div>
<caption>Total standby hours</caption>
<input class="grandtotal" value="" readonly="" />
<br>
<button onclick="addTime();">Add Time</button>
<br>
<button onclick="standBy();">Calculate total Standby hours</button>
&#13;
答案 0 :(得分:1)
从12小时格式转换为24小时格式。
以12小时格式,你需要知道一段时间:AM
(“Ante Meridiem”=“中午之前”)和PM
(“Post Meridiem”=“中午之后” )。
以下功能将12小时格式时间转换为24小时格式时间:
myTime = ['2:20', 'AM'];
myTime2 = ['8:10', 'PM'];
let timeConverter = function(time) {
if (time[1] == 'PM') {
let hourAndMinute = time[0].split(':');
let newHour = parseInt(hourAndMinute[0]) + 12;
return String(newHour) + ':' + hourAndMinute[1];
} return time[0]
}
console.log(timeConverter(myTime))
console.log(timeConverter(myTime2))