我有以下代码:
function hmsToSeconds(hms)
{
var times = hms.split(':');
var hrs = parseInt(times[0]);
var mins = parseInt(times[1]);
var secs = parseInt(times[2]);
return (hrs*3600)+(mins*60)+secs;
}
function totalSecondsWorked(start, finish, breaks)
{
return hmsToSeconds(finish) - hmsToSeconds(start) - hmsToSeconds(breaks);
}
function nearestFullHour(seconds)
{
return Math.floor(seconds/3600);
}
function checkTime(value)
{
var patt = /([0-9][0-9]):([0-5][0-9]):([0-5][0-9])/;
if (patt.test(value))
{
return value;
}
return '00:00:00';
}
function calculateDay(day)
{
var start = checkTime($("input[name='"+day+"[startTime]']").val());
var finish = checkTime($("input[name='"+day+"[endTime]']").val());
var breaks = checkTime($("input[name='"+day+"[breaks]']").val());
var seconds = totalSecondsWorked(start, finish, breaks);
var hours = nearestFullHour(seconds);
$("input[name='"+day+"[total]']").val(hours > 0 ? hours : 0);
document.getElementById('totalPayableHoursTotal').innerHTML = hours > 0 ? hours : 0;
}
$(function(){
$.each([ 'monday', 'tuesday', 'wednesday', 'thursday', 'friday' , 'saturday', 'sunday' ], function( index, day ) {
calculateDay(day);
});
$(document).on('keyup', 'input.calculate', function(e){
calculateDay($(this).data('day'));
});
});
这确实有效,但不,我需要减去休息,并认为Math.floor()方法是问题的原因,但我不是很数学&二是刚刚接触javascript,所以在寻找一些帮助。
例如,我输入09:00:00作为开始时间,然后15:00:00作为结束时间,这将是6小时,但如果我输入00:30:00,应该返回5.5小时,所以我需要让它像示例一样工作。
我还需要每天合计一周的总数,这是怎么做的?
试试这个(我已经对你的JS代码做了一些改变,所以你可能希望看到所有的):
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
function hmsToSeconds(hms) {
var times = hms.split(':');
var hrs = parseInt(times[0]);
var mins = parseInt(times[1]);
var secs = parseInt(times[2]);
return (hrs*3600)+(mins*60)+secs;
}
function totalSecondsWorked(day) {
var start = checkTime($("input[name='"+day+"[startTime]']").val());
var finish = checkTime($("input[name='"+day+"[endTime]']").val());
var breaks = checkTime($("input[name='"+day+"[breaks]']").val());
return hmsToSeconds(finish) - hmsToSeconds(start) - hmsToSeconds(breaks);
}
function nearestFullHour(seconds) {
return Math.floor(seconds/3600);
return seconds;
}
function secondsToHms(seconds_param) {
var raw_hours = seconds_param / 3600;
var hours = parseInt(raw_hours);
var raw_minutes = (raw_hours - hours) * 60;
var minutes = parseInt(raw_minutes);
var seconds = (Math.round((raw_minutes - minutes) * 100) / 100) * 60;
if (seconds > 59) {
do {
++minutes;
seconds -= 60;
} while (seconds > 59);
}
var hours_str = hours < 10 ? '0' + hours.toString() : hours.toString();
var minutes_str = minutes < 10 ? '0' + minutes.toString() : minutes.toString();
var seconds_str = seconds < 10 ? '0' + seconds.toString() : seconds.toString();
return hours_str + ':' + minutes_str + ':' + seconds_str;
}
function checkTime(value) {
var patt = /([0-9][0-9]):([0-5][0-9]):([0-5][0-9])/;
if (patt.test(value)) {
return value;
}
return '00:00:00';
}
$(document).ready(function() {
var total_seconds = 0;
$.each([ 'monday', 'tuesday', 'wednesday', 'thursday', 'friday' , 'saturday', 'sunday' ], function( index, day ) {
var seconds = totalSecondsWorked(day);
total_seconds += seconds;
$("input[name='"+day+"[total]']").val(seconds > 0 ? secondsToHms(seconds) : 0);
});
document.getElementById('totalPayableHoursTotal').innerHTML = total_seconds > 0 ? secondsToHms(total_seconds) : 0;
$('#calculate').click(function () {
var total_seconds = 0;
$.each([ 'monday', 'tuesday', 'wednesday', 'thursday', 'friday' , 'saturday', 'sunday' ], function( index, day ) {
var seconds = totalSecondsWorked(day);
total_seconds += seconds;
$("input[name='"+day+"[total]']").val(seconds > 0 ? secondsToHms(seconds) : 0);
});
document.getElementById('totalPayableHoursTotal').innerHTML = total_seconds > 0 ? secondsToHms(total_seconds) : 0;
});
});
</script>
</head>
<body>
<h5>Monday</h5>
Start: <input name="monday[startTime]" type="text" value="09:00:00" />
End: <input name="monday[endTime]" type="text" value="15:00:00" />
Breaks: <input name="monday[breaks]" type="text" value="00:30:00" />
Total: <input name="monday[total]" type="text" value="" />
<h5>Tuesday</h5>
Start: <input name="tuesday[startTime]" type="text" value="09:00:00" />
End: <input name="tuesday[endTime]" type="text" value="15:00:00" />
Breaks: <input name="tuesday[breaks]" type="text" value="00:30:00" />
Total: <input name="tuesday[total]" type="text" value="" />
<h5>Wednesday</h5>
Start: <input name="wednesday[startTime]" type="text" value="09:00:00" />
End: <input name="wednesday[endTime]" type="text" value="15:00:00" />
Breaks: <input name="wednesday[breaks]" type="text" value="00:30:00" />
Total: <input name="wednesday[total]" type="text" value="" />
<h5>Thursday</h5>
Start: <input name="thursday[startTime]" type="text" value="09:00:00" />
End: <input name="thursday[endTime]" type="text" value="15:00:00" />
Breaks: <input name="thursday[breaks]" type="text" value="00:30:00" />
Total: <input name="thursday[total]" type="text" value="" />
<h5>Friday</h5>
Start: <input name="friday[startTime]" type="text" value="09:00:00" />
End: <input name="friday[endTime]" type="text" value="15:00:00" />
Breaks: <input name="friday[breaks]" type="text" value="00:30:00" />
Total: <input name="friday[total]" type="text" value="" />
<h5>Saturday</h5>
Start: <input name="saturday[startTime]" type="text" value="09:00:00" />
End: <input name="saturday[endTime]" type="text" value="15:00:00" />
Breaks: <input name="saturday[breaks]" type="text" value="00:30:00" />
Total: <input name="saturday[total]" type="text" value="" />
<h5>Sunday</h5>
Start: <input name="sunday[startTime]" type="text" value="09:00:00" />
End: <input name="sunday[endTime]" type="text" value="15:00:00" />
Breaks: <input name="sunday[breaks]" type="text" value="00:30:00" />
Total: <input name="sunday[total]" type="text" value="" />
<br />
<input id="calculate" type="button" value="Calculate" />
<div id="totalPayableHoursTotal"></div>
</body>
</html>
也可以在jsfiddle上进行测试。
确保在投入生产之前进行彻底的测试,虽然我做了测试,但我不是真正的QA人员。^)