HTML5は標準でinputタグのバリデーション機能がついており、必須チェックや簡単なエラーチェックなどをすることが出来たりします。
必須入力のほかにも、telやemail、時間など様々なタイプのものがあります。
例えばinput type=”number”と入力すると数字しか入らないようになります。
個人的に便利だと思ったのは正規表現でしょうか。整数5桁＋少数1桁の入力のみを受け付けたいとなった時に、numberですとうまくこれを制御できません。
そんなときに下記のように正規表現を入れてエラーチェックを行うことが出来たりします。
|
1 |
<input type="text" name="cost" size="7" maxlength="7" pattern="^[0-9]{1,5}(\.[0-9])?$" title="入力値は整数5桁+少数1桁になります" id="expense1-per-cost" value="" > |
こうするとフォームの登録ボタンを押したときに、これらのエラーが出て、submitできないようになります。
参考リンク
inputタグの基礎
http://honttoni.blog74.fc2.com/blog-entry-138.html
http://www.tagindex.com/html5/form/input.html
JSとの比較など
http://labs.opentone.co.jp/?p=4730
