输入格式

Question

我正在使用input type="number"来允许用户在帖子上设置持续时间。格式为days hours:minutes:seconds，因为后端提供格式。

我需要做的是将该格式赋予输入。这可能吗？

Answer 1

您可以使用带有pattern的输入类型文本：

＆＃13;

＆＃13;

<form>
<input type="text" pattern="^\d{1,3} \d{1,2}:\d{1,2}:\d{1,2}$" placeholder="days hours:minutes:seconds"/>
  <input type="submit"/>
</form>

＆＃13;

＆＃13;

＆＃13;

它将使用1-3位数字验证文本，使用1-2位小时分钟和秒。

您还可以使用jQuery限制无数字和冒号和空格的输入：

＆＃13;

＆＃13;

$(function() {
    $('input').keydown(function(e) {
        console.log(e.which);
        if (!((e.which >= 48 && e.which <= 57) || (e.which == 186 && e.shiftKey) || e.which == 32)) {
            return false;
        }
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <input type="text" pattern="^\d{1,3} \d{1,2}:\d{1,2}:\d{1,2}$" placeholder="days hours:minutes:seconds"/>
  <input type="submit"/>
</form>

＆＃13;

＆＃13;

＆＃13;

Answer 2

如果您有jQuery，请查看：

http://jonthornton.github.io/jquery-timepicker/

Answer 3

你也可以使用

<input type="datetime">