输入时间增加 30 分钟
我有 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 分钟？
慕婉清6462132浏览 243回答 2
2回答
-
德玛西亚99
时间输入存储了一个表单的字符串值xx:xx，思路是change在开始输入添加一个事件监听器，获取它的值，给它加上30分钟，然后赋值给结束输入。这是一个可运行的代码片段，显示了一种可能的解决方案，并附有分步注释：// get input elementsconst start = document.getElementById('start');const end = document.getElementById('ende');// add a change event listener to the start inputstart.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> -
心有法竹
您可以像这里提到的那样在“：”处拆分值：如何将输入类型时间的值传递给日期对象？ 然后，您通过访问拆分数组的正确位置并添加 30 来获得分钟数。然后将值重新组合在一起并执行以下操作：document.getElementById("ende").value = newTime;而 newTime 是您添加 30 分钟的字符串。
随时随地看视频慕课网APP
相关分类
JavaScript