Architect's Log

I'm a Cloud Architect. I'm highly motivated to reduce toils with driving DevOps.

input要素(type属性 = time)

時刻用の入力フィールドを表します。

使用例

<!DOCTYPE html>
<html lang="ja">
<head>
<title>Hello! HTML5></title>
<meta charset="UTF-8">
</head>
<body>
    <form action="hoge.cgi" method="post">
        <p>
            時刻:<input type="time" id="time" min="10:10:20" max="11:10:20" step="1" />
            <input type="submit" value="送信" />
        </p>
    </form>
</body>

レンダリング

初期表示

上(下)ボタンクリック

時刻を入力して上(下)ボタンをクリックすると、時刻がインクリメント(デクリメント)されます。

エラー表示

指定できない時刻を送信しようとすると、検証エラーになります。

属性

min属性、max属性

送信可能な時刻の範囲を指定します。

step属性

既定では一分刻みで入力することができます。step属性ではその入力単位を秒で指定することができます。