<input>要素の"email"型

<input>要素の”email”型

フォーム内でメールアドレスを入力するための入力欄を設ける際に使用されます。
multiple属性が指定されている場合は、メールアドレスのリストを編集・選択する欄になります。
email型 に対応していないブラウザの場合は、text型 として扱われます。
対応しているブラウザの場合は、入力されたテキストが、メールアドレスとして妥当な形式になっているかどうかがブラウザによって検証され、その結果によって、CSS の :valid および :invalid 疑似クラスが自動的に適用され、フィールド上の現在の値が妥当なメールアドレスであるかどうかを視覚的に示すことが出来ます。

属性

<input> 要素の email型 では、以下の属性が使用できます。

autocomplete

自動補完機能を提供するかどうかを記述します。

list

その入力欄が関連付けられた、定義済みデータを提供する、<datalist> 要素の id を指定します。

readonly

この属性を指定した場合、値が変更できなくなります。

maxlength

入力できる、最大文字数を指定します。

minlength

入力できる、最小文字数を指定します。

multiple

この属性を指定した場合、ユーザーが複数のメールアドレスを、コンマと任意のホワイトスペースで区切ったリストで入力できるようになります。

pattern

値として「正規表現テキスト」を指定することで、メールアドレスの妥当性チェックをカスタマイズすることが出来ます。
なお、指定する正規表現テキストは、JavaScriptの RegExp型 で使用される正規表現テキストになります。

placeholder

プレースホルダーとして表示するテキストを指定します。

size

入力欄の見た目上のサイズを整数値で指定します。

spellcheck

要素でスペルチェックを有効にするかどうかを指定します。

• false  スペルチェックを無効にします。
• true　スペルチェックを有効にします。
• 空文字 or 未指定　要素の既定の動作に従います。

required

この属性を指定した場合、入力が必須となります。

サンプル

See the Pen OJLwYKw by Masahiko Iwakiri (@m-iwakiri) on CodePen.