HTML | メールアドレス入力フォームパーツのサンプルコード
メールアドレス入力フォームパーツのHTMLサンプルコードと表示例の紹介になります。
メールアドレス入力フォームパーツのサンプルコード
HTMLでメールアドレスを入力するフォームパーツを設置する際のサンプルコードです。
サンプルコードでは<input>タグの「type」属性に「email」を指定しています。
また、「autocomplete」属性にて「email」を指定して入力履歴から候補を表示します。
<p>メールアドレス<p>
<p><input type="email" name="email" value="" autocomplete="email"></p>以下は上記フォームのHTMLを実際に設置した結果になります。
スタイル・デザインは変更を加えていないため、サイトの設定が反映されています。
メールアドレス
メールアドレスかどうかを判定するには以下の正規表現パターンを利用できます。
^[A-Za-z0-9]+[A-Za-z0-9_.-]*@[A-Za-z0-9_.-]+.[A-Za-z0-9]+$関連：正規表現 | メールアドレスかどうか | ONE NOTES
「pattern」属性でメールアドレスかどうかを指定した場合は以下のようなHTMLコードになります。
<p>メールアドレス<p>
<p><input type="email" name="email" value="" autocomplete="email" pattern="^[A-Za-z0-9]+[A-Za-z0-9_.-]*@[A-Za-z0-9_.-]+.[A-Za-z0-9]+$"></p>