BLOG
25年新卒 WEBエンジニア インターンシップ 受付中

[ jQuery ] フォームの入力チェックをする その2

更新日:2014/04/04

フォームの入力チェックをするでフォームの入力チェックの拡張機能を作成しましたが、もうすこし使いやすくしました。

jQuery を読み込んだ後に読み込んでください。
20130826.js

まず HTML 側にクラスを指定します。使用するクラス名は以下のとおりです。

error-block
チェックしたい入力の要素とエラーメッセージの要素を囲むブロックです
error-text
エラーメッセージを出す要素です
required
必須項目にしたい input または textarea または select に指定します。未選択の selectvalue は -1 を設定します。
numeric
数字のみ許可したい input に指定します。
alphabetic
アルファベットのみ許可したい input に指定します。
hiragana
ひらがなのみ許可したい input に指定します。
katakana
カタカナのみ許可したい input に指定します。
mail
メールアドレスのみ許可したい input に指定します。
zenkaku
全角のみ許可したい input に指定します。

HTML例

JavaScript は form を指定して呼び出すだけです。複数でもできます。

JavaScript

オプションでエラーメッセージを指定できます。下記例のテキストがデフォルトになっています。

ソース

(藤崎)

FOLLOW US