Edit

Page

Page title:

Page body:

[4]
[[HTML]] の [CODE(HTMLe)@en[[[input]]]]
[[要素]]の [CODE(HTMLa)@en[[[type]]]] [[属性]]を
[DFN@en[[CODE(HTML)[[[time]]]]]] とすると、
[[時刻]]を指定する[[フォーム制御子]]となります。

;; ここで指定できる[[時刻]]には、
[[日付]]や[[時間帯]]の情報は含まれません。

;; ここで指定できるのは1[[日]]の中の[[時刻]]であり、
[[時間]]の長さではありません。

[5] 仕様書:
- [[Web Forms 2.0]]
-- [CSECTION@en[2.4. Extensions to the [CODE(HTMLe)@en[[[input]]]] element]]
<IW:WF2:"#extensions">

[[#comment]]

** 値

*** 構文

[6]
[[DOM]] 内や[[フォーム提出]]時に用いられる値は、
[[ISO 8601]] の[[プロファイル]]であり、
次のような構文を有します。
- [[時]]: 2桁の[[数字]] ([CODE(HTML)[[[0]]]]〜[CODE(HTML)[[[9]]]])
- [CODE(HTML)[[[:]]]]
- [[分]]: 2桁の[[数字]]
- 省略可能:
-- [CODE(HTML)[[[:]]]]
-- [[秒]]: 2桁の[[数字]] ([[既定値]]は [CODE(HTML)[[[0]]]])
-- 省略可能:
--- [CODE(HTML)[[[.]]]]
--- [[秒]]以下: 1桁[[以上]]の[[数字]]
([[既定値]]は[[零]])

[[数]]は[[十進数]]と[['''しなければなりません''']]。
必要なら[[零埋め]][['''しなければなりません''']]。

[SRC@en[WF2 2.4]]

[[#comment]]

*** 暦

[14]
[[時刻]]は0[[以上]]24[[時間]][[以下]]と[['''しなければなりません''']]。
[SRC@en[WF2 2.4]]

[3] [[閏秒]]に関しては、 [CODE(HTML)@en[[[datetime]>>14]]]
の項を参照してください。

[[#comment]]

*** 例

[7] [CODE(HTML example)[23:59:00.00000]]
[SRC@en[WF2 2.4]]

[3] [CODE(HTML example)[00:00:05]]
[SRC@en[WF2 2.4]]

[[#comment]]

*** メモ

[16] [[零点]]は、 [CODE(HTML)@en[[[00:00]]]]
です。
[SRC@en[WF2 2.4.2]]

[[#comment]]

** 属性との関係

[8]
[CODE(HTMLa)@en[[[step]]]] [[属性]]は[[秒]]単位の精度を表します。
[[既定値]]は [CODE(HTML)[[[60]]]] (1[[分]]) です。
[SRC@en[WF2 2.4]]

* レンダリング

[9]
[[利用者エージェント]]は適切な [[widget]]、
例えば[[時計]]を使うことが期待されます。
[SRC@en[WF2 2.4]]

[15]
[[利用者エージェント]]は、[[利用者]]に対し、
[[時間帯]]の情報が含まれないことを明らかにするべきです。
[SRC@en[WF2 2.4]]

[21] 
[[時刻]]は、[[12時間制]]や[[24時間制]]で表示されるのが普通です。
理屈の上では[[30時間制]]やその他の[[時刻制度]]で表示することもできるのですが、
実際にそのような表示をする[[利用者エージェント]]の存在は確認されていません。

;; [22] 夜間の時間帯を選択させるような場合は[[30時間制]]で表示してくれる方が嬉しかったりするんですが。

* 互換性

[13] '''未対応利用者エージェントとの互換性'''

[CODE(HTML)@en[[[month]]]] に対応していない[[利用者エージェント]]は、
[CODE(HTML)@en[[[text]]]] (単一行[[文章入力制御子]])
として扱います。従って、[[利用者]]は任意の文字列を入力することができます。

ですから、[[著者]]は、対応している[[利用者エージェント]]が一般的になるまでの間、
[[フォーム制御子]]の近くで記入方法を説明しておくのがよいでしょう。
[[フォーム処理エージェント]]は記入された値が適当か検査するべきです
(これは[[安全性]]の観点からも重要です)。

[[#comment]]

** 歴史

[10]
この [CODE(HTMLe)@en[[[input]]]] [CODE(HTMLa)@en[[[type]]]]
は [[Web Forms 2.0]] で導入されました。

[[#comment]]

** 実装

[11]
[[Opera 9]] が実装しています。

[[#comment]]

** 関連

[12]
[CODE(HTMLe)@en[[[input]]]] [CODE(HTMLa)@en[[[type]]]]
として、[[日付]]のための [CODE(HTML)@en[[[date]]]]、
[[日付]]と[[時刻]]のための [CODE(HTML)@en[[[datetime]]]]
や [CODE(HTML)@en[[[datetime-local]]]] などがあります。

* メモ

[61] [CITE@en[(X)HTML5 Tracking]]
([TIME[2009-08-23 10:11:49 +09:00]] 版)
<http://html5.org/tools/web-apps-tracker?from=2433&to=2434>

[62] [CITE[IRC logs: freenode / #whatwg / 20090909]]
([TIME[2009-10-18 18:18:41 +09:00]] 版)
<http://krijnhoetmer.nl/irc-logs/whatwg/20090909#l-714>

[63] [CITE[IRC logs: freenode / #whatwg / 20100413]]
([TIME[2010-04-28 00:16:26 +09:00]] 版)
<http://krijnhoetmer.nl/irc-logs/whatwg/20100413#l-70>

[64] [CITE[IRC logs: freenode / #whatwg / 20100820]]
( ([TIME[2010-08-22 16:21:56 +09:00]] 版))
<http://krijnhoetmer.nl/irc-logs/whatwg/20100820#l-218>

[65] [CITE@en[Web Applications 1.0 r5406 note that japan styles year and year-month specially, so that we can support that, once we've proved that this actually gets used at all]]
( ([TIME[2010-08-31 09:35:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=5405&to=5406>

[66] [CITE@en[Web Applications 1.0 r8203       Allow type=time to have min>max, so that times can span midnight.]]
( ([TIME[2013-10-02 07:57:00 +09:00]] 版))
<http://html5.org/tools/web-apps-tracker?from=8202&to=8203>

[1] 
[[Chrome]] は、

- 無指定、不正な値、 [CODE[step=any]] は [CODE[[[step][step=""]]=60]] とみなします。
- [CODE[[[step][step=""]]=60]] だと時と分を編集可能な状態で表示します。
- [CODE[[[step][step=""]]=1]] だと時と分と秒を編集可能な状態で表示します。
- [CODE[[[step][step=""]]=0.001]] だと時と分とミリ秒までの小数を含む秒を編集可能な状態で表示します。
- それより小さな数でもミリ秒までになります。
- [CODE[[[step][step=""]]=3600]] だと時と分を表示し時だけ編集可能な状態で表示します。

[TIME[2019-04-03T08:58:47.000Z]]

[2] 
[[iOS]] の [[Safari]] は対応しているけど
[[Mac]] の [[Safari]] は対応していないらしい。
おかしいだろ...
[TIME[2020-02-12T06:57:08.900Z]]

[17] 
[[iOS]] の [[Safari]] は
[CODE[step]]
[[属性]]に未対応で、常に分単位でしか指定できないらしい。
[TIME[2020-03-19T03:59:19.500Z]]

[18] 
[[iOS]] の [[Safari]]
は実は
[[DOM]]
レベルでは
[CODE[step]]
属性に対応しているようです。
[CODE[step]]
[[IDL属性]]は仕様通りに動作するようですし、
[CODE[stepUp]]
[[メソッド]]や
[CODE[stepDown]]
[[メソッド]]も
[CODE[step]]
属性の指定通りに動きます。
[CODE[step]]
属性が省略されたときに
[CODE[[[step]]=60]]
相当になるのも仕様通り。

ところが
[[UI]]
側はこれにまったく影響されず、常に
[CODE[[[step]]=60]]
相当の表示と編集しかできません。
[[DOM]]
側からそのことを知るのは困難。

[19] 
仕様書と
[[Chrome]]
と
[[Firefox]]
では、
値が
[CODE[step]]
の整数倍になっていないとき、
[CODE[stepUp]]/[CODE[stepDown]]
で近い整数倍の値になります、
[[iOS]] の [[Safari]]
ではそうではなく、
[CODE[step]] 分加算されるだけです。
[[Mac OS X]] の [[Safari]]
は不明。

[20] 
[[Windows]]
の
[[Chrome]]
では、
[[ミリ秒]]単位まで編集できます。
[CODE[step]] に対して不適切な値が指定されたときでも、
初期状態では[[ミリ秒]]単位で指定された値が表示されます。
編集すると
[CODE[step]]
を考慮した値になります。

[CODE[[[step]]=[[any]]]] 
にしていると、
指定されている値に端数がなければ、
時と分しか表示されない状態になります。
[[UI]] から秒とそれ以下を編集できる状態にする方法がなさそうです。

[CODE[step]]
に関わらず、
[[ミリ秒]]より小さな値は編集された時点で失われます。
[TIME[2020-10-23T03:39:34.00Z]]

[23] [CITE[New WebKit Features in Safari 14.1 | WebKit]]
([TIME[2021-04-30T06:59:41.000Z]])
<https://webkit.org/blog/11648/new-webkit-features-in-safari-14-1/>

[24] 
[[Windows]] の [[Chrome]] で表示される時刻選択ウィジェットの選択肢リストは、
選択中の値の前後7つしか表示されなくて (スクロールバーなどもなく) 
[[マウス]]操作でそれ以外に変更できません。
([[キーボード]]操作ならそれ以外にも変更できるのですが、
[[キーボード]]が使えるなら選択肢リストを開かずに直接テキストボックスに数字を書けばいいので、
意味不明。。。)
[TIME[2021-10-19T05:48:45.900Z]]

Historical Legal Sensitive Parent: [Help / License]

Edit

Page

Page name(s)