文書の過去の版を表示しています。

フォーム

HTML5で追加されたフォーム要素

変更点多数だが、2010年9月現在、ほとんどのブラウザは未対応。OperaがURLやDate等に対応しているほか、iPhoneで使うとソフトウェアキーボードがそれぞれのフォームに適したキーに変化する。iPhoneサイトを作成するならば積極的に使いたい。

iPhone用サイトのフォームにはHTML5の属性を使おう - nullpo.printStackTrace();

新しい input type
入力サジェスト（input list属性とdatalist要素）
form method属性のDELETE、PUT対応
ネストしていないform要素とinput select要素の関連付け（input select要素のform属性）
フォーム入力値バリデーション
- 入力必須項目の明示（required属性）
- 正規表現マッチング（pattern属性）
select要素のoptionの内容を外部参照可能に（select data属性）

<html> <form action=“” method=“get”> <table> <tr><td>Search</td><td><input type=“search”/></td> <tr><td>URL</td><td><input type=“url”/></td></tr> <tr><td>E-mail</td><td><input type=“email”/></td></tr> <tr><td>Date</td><td><input type=“date”/></td></tr> <tr><td>Time</td><td><input type=“time”/></td></tr> <tr><td>Number</td><td><input type=“number”/></td></tr> <tr><td>Range</td><td><input type=“range” max=“10” min=“1”/></td></tr> <tr><td>Week</td><td><input type=“week”/></td></tr> <tr><td>Datetime</td><td><input type=“datetime”/></td></tr> <tr><td>Color</td><td><input type=“color”/></td></tr> </table> </form> </html>