wulin.com(www.vevb.com)記事はじめに:入力用の新しく追加されたタイムタイプアプリケーション。
今日、Web Teaching Webサイトは、HTML5の新機能を高く評価するようになります。 HTML5へのタグ付け入力の適用は、新しく追加された時間型です。次の入力ボックスに入力された形式が正しくない場合、送信できません。
注:このタイプの入力はOpera10+で効果的ですが、Chromeではあまり良くなく、外観はブラウザに依存します。
1。日付タイプ:
<form>
<入力id = webjx_date name = webjx.com type = date/>
<入力タイプ=送信値=送信/
</form>
以前にJS+CSS+DOMを使用した場合、カレンダーで日付を選択する効果を実現できます。 HTML5では、日付タイプに入力を設定する必要があり、フォームを送信するときにデータを検証する必要はありません。実装に役立ちました。
操作効果は次のとおりです。
2。時間タイプ:
<form>
<入力ID = webjx_time name = webjx.com type = time/>
<入力タイプ=送信値=送信/
</form>
このタイプは、時間の入力に特別に使用されるテキストボックスであり、送信時に有効な時間が入力されているかどうかを確認します。
操作効果は次のとおりです。
3。DateTimeタイプ:
<form>
<入力id = webjx_datetime name = webjx.com type = datetime/>
<入力タイプ=送信値=送信/
</form>
DateTimeタイプの入力要素は、UTCの日付とプラクティスの入力に特別に使用されるテキストボックスです。提出中、日付と時刻は効果的にチェックされます。
操作効果は次のとおりです。
4。DateTime-Localタイプ:
<form>
<入力ID = webjx_dateTime-local name = webjx.com Type = DateTime-Local/>
<入力タイプ=送信値=送信/
</form>
このタイプはデータタイムタイプに似ていますが、ローカルの日付と時刻を入力するために使用されます。
操作効果は次のとおりです。
5。月タイプ:
<form>
<input id = webjx_month name = webjx.com type = month/>
<入力タイプ=送信値=送信/
</form>
月は、特に月に入るテキストボックスです。カレンダーでは、特定の日ではなく、特定の月のみを選択できます。
操作効果は次のとおりです。
6。週タイプ:
<form>
<入力id = webjx_week name = webjx.com type = week/>
<入力タイプ=送信値=送信/
</form>
ウィークは、週(週)に入るために特別に使用されるテキストボックスであり、その後の数は今週の週の数週間を示します。カレンダーで1週間しか選択できず、特定の日を選択することはできません。
操作効果は次のとおりです。
HTML5はこの点で非常にうまく機能しています。スタイルの定義に関しては、誰もがここでそれについて議論することを歓迎します!