やってみようメールアドレスに途中まで打って次の欄へ移ってみてください
入力フォームメジャー（よく見る）
入力チェック（バリデーション）
Inline Validation
入力欄から離れたとき、間違いがあれば赤い枠と理由がその場に出て、正しければ緑のチェックが付く。
別名リアルタイムバリデーションエラーメッセージ入力エラー表示フォームバリデーション
どこで使われている？
- よく見かける場所
- 会員登録、ネット通販の住所入力、各種申し込みフォーム
- 使うとよい場面
- 送信する前に、入力の間違いをその場で知らせたいとき
- 避けたい場面
- 打っている途中で赤く怒ること（欄を離れたときに確認する）
補足打っている途中から赤く怒られると嫌な気持ちになるので、欄から離れたときに確認するのが一般的です。
AIへの指示文
これをコピーしてAIに貼り付ければOKです。Webサイトを作る前提の内容です（右上の「何を作る？」で変えられます）。
HTML / CSS / JavaScript で「入力チェック（バリデーション）（Inline Validation）」を実装してください。 動き：入力欄から離れたときに内容を確認し、間違っていれば枠を赤くして、欄のすぐ下に理由（例：「@ が入っていません」）を表示する。正しく直したら赤を消して緑のチェックを付ける。送信ボタンはすべて正しくなるまで押せないようにする。 使う部品：input の検証（:user-invalid や aria-invalid）で自作
もっと詳しく：プログラムでの部品名
同じ動きでも、作るものによってプログラムの中での部品の名前が違います。上の指示文にはすでに入っているので、覚える必要はありません。AIの説明に出てきた単語を確認したいときに使ってください。
| Webサイトなら | input の検証（:user-invalid や aria-invalid）で自作 |
|---|---|
| iPhoneアプリなら | TextField の onChange で確認し、下に文字を出して自作 |
| Androidアプリなら | OutlinedTextField の isError と supportingText |
| Flutterなら | TextFormField の validator（autovalidateMode） |
| React Nativeなら | react-hook-form |