[英]HTML5: input type duration
有没有办法使用输入类型 duration 。 我试图以某种方式进行输入,用户可以添加这样的时间持续时间06:30:27:15 ( hh:mm:ss:ms )
并且应该只允许(0-23:0-59:0-59:0-59)
。
任何帮助表示赞赏!
注意!:我想在 Angular2+ 中实现它。
也许尝试这样的事情:
<input type="time" step="0.001">
遗憾的是,HTML 输入和 JavaScript 本身都不支持持续时间数据类型。 <input type="time">
用于一天中的某个时间,并且可能会根据您的语言环境显示 AM/PM 选择器。
最好的办法是使用文本输入并使用 JavaScript 事件自动插入:
并忽略无效输入。 使用模式属性也可能有所帮助。 在从 JavaScript 方面使用它之前,请务必将值转换为数字。 这里有一些东西可以让你开始。
{ let durationIn = document.getElementById("duration-input"); let resultP = document.getElementById("output"); durationIn.addEventListener("change", function (e) { resultP.textContent = ""; durationIn.checkValidity(); }); durationIn.addEventListener("invalid", function (e) { resultP.textContent = "Invalid input"; }); }
input:invalid:not(:focus) { background: red; }
<input id="duration-input" type="text" required pattern="[0-9]{2}:[0-9]{2}:[0-9]{2}:[0-9]{2}" value="00:00:00:00" title="Write a duration in the format hh:mm:ss:ms"> <p id="output"></p>
我确信有许多开源库为此提供了现成的小部件。
<label for="appt">Choose a time for your meeting:</label>
<input type="time" id="appt" name="appt"
min="09:00" max="18:00" required>
<small>Office hours are 9am to 6pm</small>
试试这个...我希望这会有所帮助! 这是我为我的一个项目所做的事情......
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.