我有 2 个输入（类型 =“时间”）。我希望在第一个输入字段中输入的时间获得 + 30 分钟并将其写入第二个输入字段。有可能吗？我不太擅长 JS :I<html> <form> <label for="start">Start: <input type="time" id="start" name="start" step="600"> </label><br> <label for="ende">Ende: <input type="time" id="ende" name="ende" step="600"> </label> <input type="submit" value="senden"> </form></html>我想我需要在 JS 中获取输入 ID 并添加 30 分钟？像这样：document.getElementById('start').value;...但如何添加 30 分钟？
2 回答
德玛西亚99
TA贡献1770条经验 获得超3个赞
时间输入存储了一个表单的字符串值xx:xx，思路是change在开始输入添加一个事件监听器，获取它的值，给它加上30分钟，然后赋值给结束输入。
这是一个可运行的代码片段，显示了一种可能的解决方案，并附有分步注释：
// get input elements
const start = document.getElementById('start');
const end = document.getElementById('ende');
// add a change event listener to the start input
start.addEventListener('change', () => {
// get hours and minutes as integer values
let hours = parseInt(start.value.split(':')[0]);
let minutes = parseInt(start.value.split(':')[1]);
// add 30 minutes
minutes += 30;
// if an hour is exceeded, add it to hours instead
// and account for a day passing by
if (minutes >= 60) {
hours = (hours + 1) % 24;
minutes -= 60;
}
// reformat values as strings with a fix length of 2
hours = (hours < 10 ? `0${hours}` : `${hours}`);
minutes = (minutes < 10 ? `0${minutes}` : `${minutes}`);
// assign new value to the end input
end.value = `${hours}:${minutes}`;
});
<form>
<label for="start">Start: <input type="time" id="start" name="start" step="600"> </label><br>
<label for="ende">Ende: <input type="time" id="ende" name="ende" step="600"> </label>
<input type="submit" value="senden">
</form>
心有法竹
TA贡献1866条经验 获得超5个赞
您可以像这里提到的那样在“：”处拆分值：如何将输入类型时间的值传递给日期对象？ 然后，您通过访问拆分数组的正确位置并添加 30 来获得分钟数。然后将值重新组合在一起并执行以下操作：
document.getElementById("ende").value = newTime;而 newTime 是您添加 30 分钟的字符串。
添加回答
举报
0/150
提交
取消