トップページ  > HTML Living Standard  > <input>  > multiple

★HTML Living Standard リファレンス

<input multiple> …… 複数選択可にする
Internet Explorer Microsoft Edge Google Chrome Safari Firefox Opera
広告

<input multiple>は、複数選択可にする際に使用します。

入力要素にrequired属性を指定すると、 ユーザーが複数の値を指定できるようになります。

■属性

multiple属性
複数の値を許可するかどうかを指定します。

■使用例

以下のサンプルは、multiple属性の指定の有無による違いを示しています。 multiple属性を指定しなければ選択できるファイルはひとつだけですが、 multiple属性を指定すると選択できるファイルが複数になります。

HTMLソース

<p><label>ファイル(ひとつだけ): <input type=file name=ofile></label></p>
<p><label>ファイル(複数選択可): <input type=file name=mfile multiple></label></p>
↓↓↓

ブラウザ上の表示

■使用例

以下のサンプルは、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="hedral@damowmow.com">
 <option value="pillar@example.com">
 <option value="astrophy@cute.example">
 <option value="astronomy@science.example.org">
</datalist>
↓↓↓

ブラウザ上の表示

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