input type=”datetime” 使い方

<input type="datetime">…… UTC(協定世界時)による日時の入力欄を作成する

<input>タグのtype属性でtype="datetime"を指定すると、UTC(協定世界時)による日時の入力欄が作成されます。
入力された値はグローバル日時を表すことになります。

name属性は入力欄に名前を付ける属性ですが、<form>でデータが送信される際、name属性で指定した名前と、入力された値が一組になって送信されます。

ユーザーは空文字を入力することができます。入力必須にする場合には、required属性を併用してください。

type="datetime"の場合、step属性の単位は秒、初期値は60となります。

■グローバル日時について

ここで言うグローバル日時(global date and time)とは、協定世界時(UTC)をベースに指定する日時のことです。UTC(Universal Time, Coordinated、協定世界時)とは、世界の公式な標準時刻のことです。天体観測から決定されるグリニッジ標準時(GMT)とほぼ同じですが、UTCはセシウム原子時計が刻む国際原子時をもとに決定されています。日本のローカル時刻はUTCに対して9時間進んでいるので、以下の書式でグローバル日時として指定します。

YYYY-MM-DDThh:mm:ssTZD
YYYY 年(4桁)
MM 月(2桁/01~12)
DD 日(2桁/01~31)
T ここから時間が始まることを表す文字(大文字のT)
hh 時(2桁/00~23)
mm 分(2桁/00~59)
ss 秒(2桁/00~59)
TZD タイムゾーン(Z,+hh:mm,-hh:mm)
Z …… UTCそのものであることを表す文字(大文字のZ)
+hh:mm …… UTCよりローカル時刻が進んでいる場合
-hh:mm …… UTCよりローカル時刻が遅れている場合

例えば、「日本時間の2012年2月11日23時05分00秒」を表す場合、「2012-02-11T23:05:00+09:00」のように記述します。最後の「+09:00」はUTCに対して9時間進んでいるという意味で、日本時間であることを表しています。

また、表す日時がUTCそのものの場合には、「2007-12-19T00:00Z」という具合に大文字のアルファベットのZを付けます。例えば、「2007-12-19T00:00Z」は、「協定世界時の2007年12月19日の深夜0時0分」という意味です。

必要な場合にはミリ秒単位の指定も可能です。日時の記述方法についての詳細は、W3Cのウェブページでご確認ください。

■type=”datetime”の場合に指定可能な属性

type=”datetime”
UTC(協定世界時)による日時の入力欄を作成する
name属性
フォーム部品に名前をつける
value属性
送信される値を指定する
autocomplete属性
入力候補を提示して入力内容を自動補完する(on・off・default)(初期値はdefault)
list属性
ユーザーに入力候補として提案するデータリストの要素を、その要素のid属性の値で指定する
max属性
入力できる最大値を指定する
min属性
入力できる最小値を指定する
readonly属性
ユーザーによるテキスト編集を不可にして読み取り専用にする(readonly)
required属性
入力必須にする
step属性
入力欄で刻むステップ値を指定する(type=”datetime”の場合、単位は秒、初期値は60)

■HTML5での使用例

<form action="xxx.php" method="post">
<label>日時(type="datetime"):<input type="datetime" name="datetime"></label>
<input type="submit" value="送信">
</form>

参考:http://www.htmq.com/html5/input_type_datetime.shtml

カテゴリー: HTML5, ナレッジノート   パーマリンク

input type=”datetime” 使い方 への1件のコメント

  1. Kaydence より:

    You pointed out that they used the least amount of CGI possible when I found the total opposite. The thing that bothered me about this film was that they used FAR TOO MUCH CGI. It was actually distracting, they totally went overboard with it. Soy0r&#823r;.I just thought it was funny that on that point in your talk about it was as if we were watching a different movie from one another

コメントを残す

メールアドレスが公開されることはありません。