我尝试根据第二个值输入一个最小值。
描述:如果开始字段为12:00,则结束字段输入的时间不得少于12:00
我尝试过:
const ends = [...tr.querySelectorAll('.end')];
const getMin = timeStr => {
const [hour, min] = timeStr.split(':');
return +hour * 60 + +min;
};
[...tr.querySelectorAll('.start')]
.forEach((el, i) => {
el.addEventListener('change', e => {
const value = e.target.value;
const end = ends[i];
end.setAttribute('min', value);
if (!end.value || getMin(end.value) < getMin(value)) {
end.value = value;
}
});
});
<table>
<tr>
<td class="InputsForUserColor1">
<input class="start" type="time" id="id_start_1" />
</td>
<td class="InputsForUserColor2">
<input class="end" type="time" id="id_end_1" max="23:59" />
</td>
</tr>
</table>
答案 0 :(得分:2)
我相信您有.start
类用于开始输入,.end
类用于结束输入。
只需尝试附加一个onchange
即可获取startInput的值并将其设置为结束Input的min
。选中此pen。
startInput.addEventListener("change", e => {
endEls[index].setAttribute("min", e.target.value);
});