
フォームバリデーションで使える正規表現まとめ
フォームのバリデーションなど入力した文字がきちんと入力されているかを判定する為に、正規表現というものが使われます。正規表現とは「文字列の集合を一つの文字列で表現する方法」のことを指します。この正規表現をif文などの条件式に当て込み、入力した文字をチェックします。今回は備忘録としてバリデーションで使える正規表現をまとめてみました。
バリデーションにおける正規表現
【名前】全角文字で入力されているか/^[ぁ-んァ-ヶー一-龠]+$/【ふりがな】全角ひらがなで入力されているか
/^[あ-ん゛゜ぁ-ぉゃ-ょー「」、]+/【フリガナ】全角カタカナで入力されているか
/^[ア-ン゛゜ァ-ォャ-ョー「」、]+$/【フリガナ】半角カタカナで入力されているか
/^[ア-ン゙゚ァ-ォャ-ョー。「」、]+$/【メールアドレス】アットマークを含む正しい形式で入力されているか
/^([a-zA-Z0-9])+([a-zA-Z0-9\._-])*@([a-zA-Z0-9_-])+([a-zA-Z0-9\._-]+)+$/【電話番号】半角数字で入力されているか
/^[0-9]+$/【電話番号】半角ハイフンを含んだ1〜4桁・1〜4桁・3〜4桁の半角数字の形式で入力されているか
/^0\d{1,4}-\d{1,4}-\d{3,4}$/
【URL】http://もしくはhttps://から始まる正しい形式で入力されているか
/http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w-.\/?%&=]*)?/【ユーザー名など】半角英数字で入力されているか
/^[a-zA-Z0-9]+$/【テキスト入力】n文字以上m文字以下で入力されているか
/^.{100,300}$/ 例:100文字以上300文字以下
【テキスト入力】HTMLタグが含まれているか
/[<(.*)>.*<\/\1>]/
if文のなかで条件分岐させる例
これらの正規表現をjavascriptやPHPのif文で使用し入力文字の判定を行います。 【javascript】if ( !$(セレクタ名).val().match(正規表現) ) {
//正規表現にマッチしない場合の処理
}
inputなどセレクタ指定し、valueの値に対してmacth関数を用いて、引数に正規表現を指定します。
【PHP】
if ( preg_match("正規表現", $subject) ) {
//正規表現にマッチする場合の処理
}else{
//正規表現にマッチしない場合の処理
}
preg_match関数を使用し、正規表現を指定します。$subjectには対象の文字列を指定します。
categories
- WordPress(61)
- JavaScript(49)
- Vue.js(48)
- CSS(46)
- jQuery(34)
- Nuxt.js(22)
- Sass(21)
- Gulp(17)
- webpack(16)
- PHP(14)
- HTML(14)
- GSAP(11)
- React(10)
- Vite(9)
- Pug(9)
- Laravel(8)
- Cordova(8)
- Linux(7)
- Next.js(6)
- Apache(5)
- Shopify(4)
- REST API(4)
- Node.js(4)
- Smarty(3)
- Git(3)
- JSON(3)
- その他プログラミング(3)
- Google Apps API(3)
- Bootstrap(3)
- 環境構築・システム(3)
- TypeScript(2)
- EJS(2)
- RMS(2)
- Docker(2)
- Instagram API(2)
- Excel VBA(2)
- SVG(1)
- Dart(1)
- ECカートASP(1)
- Markdown(1)
- AMP(1)
- Nginx(1)
- XML(1)
- shellscript(1)
- Ruby(1)
- MySQL(1)