描述: 我有:(在表格中)
2个要输入数据的列:
a)开始,
b)结束。(信息:结束必须大于开始才能正常工作)
2个计算/恒定的数据列:
a)实际(结束-开始),
b)规范(常数)
2个我正在尝试计算的数据列:
a)剩余,
b)不足
代码行动:(现在它正在工作)
用户输入以下字段:
a)开始
b)结束(必须大于开始)[跳过]
字段被计算
a)实际=结束-开始。
字段是恒定的。
a)规范
我的目标是什么:
完成以下字段:
a)剩余(如何?=>剩余=实际-规范)(如果实际>规范)
b)不足(如何?=>不足=规范-实际)(如果实际<规范)
我尝试了什么?:
function diff (start, end) {
start = start.split(":");
end = end.split(":");
const startDate = new Date(0, 0, 0, start[0], start[1], 0);
const endDate = new Date(0, 0, 0, end[0], end[1], 0);
let diff = endDate.getTime() - startDate.getTime();
const hours = Math.floor(diff / 1000 / 60 / 60);
diff -= hours * 1000 * 60 * 60;
const minutes = Math.floor(diff / 1000 / 60);
return (hours < 9 ? "0" : "") + hours + ":" + (minutes < 9 ? "0" : "") + minutes;
}
document.querySelector('table').addEventListener('change', function(e) {
const classList = e.target.classList
if (classList.contains('start') || classList.contains('end')) {
//retrieve the associated inputs
const tr = e.target.parentNode.parentNode
const [start, end, actual, normative, surplus, deficiency] = [...tr.querySelectorAll('.start,.end,.actual,.normative,.surplus,.deficiency')]
const value = diff(start.value, end.value)
actual.value = value
}
})
// I tried:
/* <-----------------------------comment
if (actual.value > normative.value)
{
const value_an = diff_act_nor()
surplus.value = value_an
}
else if (actual.value < normative.value)
{
const value_na = diff_nor_act()
deficiency.value = value_na
}
else{
// do nothing
}
}
function diff_nor_act (actual, normative) {
actual = actual.split(":");
normative = normative.split(":");
const actualDate = new Date(0, 0, 0, actual[0], actual[1], 0);
const normativeDate = new Date(0, 0, 0, normative[0], normative[1], 0);
let diff = normativeDate.getTime() - actualDate.getTime();
const hours = Math.floor(diff / 1000 / 60 / 60);
diff -= hours * 1000 * 60 * 60;
const minutes = Math.floor(diff / 1000 / 60);
return (hours < 9 ? "0" : "") + hours + ":" + (minutes < 9 ? "0" : "") + minutes;
function diff_act_nor (actual, normative) {
actual = actual.split(":");
normative = normative.split(":");
const actualDate = new Date(0, 0, 0, actual[0], actual[1], 0);
const normativeDate = new Date(0, 0, 0, normative[0], normative[1], 0);
let diff = actualDate.getTime() - normativeDate.getTime();
const hours = Math.floor(diff / 1000 / 60 / 60);
diff -= hours * 1000 * 60 * 60;
const minutes = Math.floor(diff / 1000 / 60);
return (hours < 9 ? "0" : "") + hours + ":" + (minutes < 9 ? "0" : "") + minutes;
---comment-------------> */
<table>
<thead>
<tr>
<th>start</th>
<th>end</th>
<th>actual</th>
<th>normative</th>
<th>surplus</th>
<th>deficiency</th>
</tr>
</thead>
<tbody>
<tr class="day">
<td><input type="time" class="start" id="start_1" value="08:00"></td>
<td><input type="time" class="end" id="end_1" value="15:00"></td>
<td><input type="time" class="actual" id="actual_1" value="07:00" readonly></td>
<td><input type="time" class="normative" id="normative_1" value="08:00" readonly></td>
<td><input type="time" class="surplus" id="surplus_1" value="00:00" readonly></td>
<td><input type="time" class="deficiency" id="deficiency_1" value="00:00" readonly></td>
</tr>
<tr class="day">
<td><input type="time" class="start" id="start_2" value="08:00"></td>
<td><input type="time" class="end" id="end_2" value="17:00"></td>
<td><input type="time" class="actual" id="actual_2" value="09:00" readonly></td>
<td><input type="time" class="normative" id="normative_2" value="08:00" readonly></td>
<td><input type="time" class="surplus" id="surplus_2" value="00:00" readonly></td>
<td><input type="time" class="deficiency" id="deficiency_2" value="00:00" readonly></td>
</tr>
</tbody>
</table>
注释代码
a) 注释的代码无法运行。
b) 取消注释后,它会破坏原本可以正常工作的代码,现在代码可以正常运行。
注:
a) 给定的“值”是随机输入的,用于更好地说明情况。