トップページ  > HTML Living Standard  > <input>  > type=email

★HTML Living Standard リファレンス

<input type=email> …… 電子メールアドレスの入力欄を表す
Internet Explorer Microsoft Edge Google Chrome Safari Firefox Opera
広告

<input type=email>は、電子メールアドレスの入力欄を表す際に使用します。

input要素のtype属性の値に email を指定すると、 要素の値は電子メールアドレス、または、電子メールアドレスのリストを表します。

Email状態のinput要素では、 multiple属性が指定されているかどうかによって動作が異なります。

multiple属性が指定されていない場合、 単一の電子メールアドレスを編集するためのコントロールを表します。 input要素にvalue属性がある場合、 その値は有効な電子メールアドレスである必要があります。

multiple属性が指定されている場合、 複数の電子メールアドレスを追加、削除、編集するためのコントロールを表します。 input要素にvalue属性がある場合、 その値はカンマ( , )区切りの有効な電子メールアドレスのリストである必要があります。

■属性

name属性
フォーム部品に名前をつけます。
value属性
入力される値を指定します。 type=emailの場合には、妥当な電子メールアドレスを指定する必要があります。
multiple属性
複数の値を入力・選択できるようにします。

■使用例

以下のサンプルは、input要素のtype属性の値に email を指定して、電子メールアドレス入力欄を作成しています。

HTMLソース

<label>メールアドレス: <input type=email name="usermail"></label>
↓↓↓

ブラウザ上の表示

■使用例

以下のサンプルは、type=emailと同時にmultiple属性を指定しています。 ユーザーは、カンマ( , )区切りでメールアドレスのリストを入力することができます。

HTMLソース

<label>宛先リスト(カンマ区切り): <input type=email multiple name="to"></label>
↓↓↓

ブラウザ上の表示

■使用例

以下のサンプルは、datalist要素で入力候補を指定しています。 例えば、ユーザーが「as」とメールアドレスを入力し始めた際に、 使用しているブラウザによっては入力候補が「astrophy」と「astronomy」に絞り込まれていくかもしれません。

HTMLソース

<label>宛先リスト(カンマ区切り): <input type=email multiple name="to" list="contacts"></label>
<datalist id="contacts">
 <option value="[email protected]">
 <option value="[email protected]">
 <option value="[email protected]">
 <option value="[email protected]">
</datalist>
↓↓↓

ブラウザ上の表示

input要素の終了タグについて

HTMLの仕様では、input要素には終了タグ</input>はありません。

■関連項目

広告
Sponsors
広告
MuuMuu Domain!
ドメイン取るならお名前.com
現役エンジニアのオンライン家庭教師【CodeCamp】
サイトに広告を掲載してお小遣いが稼げる!【A8.net】
Node.jsコース
はじめてのプログラミングコース
▲ページ先頭へ
HTMLクイックリファレンスについて
© HTMQ