accept 属性受け取るファイル種別を指定する

accept 属性は、サーバが受け取ることが可能なファイルの種別を指定します。値には、MIME タイプの一部、もしくは全部。または、拡張子を指定することができます。また、複数の値をカンマ (,) 区切りで指定することも可能です。

指定できる値の例

例えば accept 属性を accept="text/plain" を指定すれば、プレーンテキストのみが送信でき、それ以外のファイル形式は選択できなくなります。また、形式は問わず、画像だけを受け入れたい場合は、accept="image/*" などとすることも可能です。

拡張子による指定も可能で下記のように書くことができます。HTML5 仕様書では、拡張子と MIME タイプを併記することを推奨しています。

accept=".jpg"

また、値はカンマ区切りで複数指定できますので、

accept=".jpg,.gif,.png,image/gif,image/jpeg,image/png"

のように指定して、細かく制御することが可能です。

ただし、対応していないブラウザに関してはこの制限が機能しないため、受け入れ側となるサーバサイドのプログラムでファイルチェックなどをあわせて行うのが望ましいでしょう。

accept 属性の仕様

この属性を使用できる要素

accept 属性のサンプルソース

<input type="file" name="upload" accept="image/gif,image/jpeg,image/png" />
<input type="file" name="upload" accept="image/*" />
<input type="file" name="upload"
 accept=".doc,.docx,.xml,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document" />

仕様書の該当箇所

The accept attribute

用途から目的の要素を探す

用途から HTML5 の要素を逆引きできます。

テキストに対する意味づけを行いたい
テキストの編集を示したい
改行や折り返しを指定したい
上付きや下付きを指定したい
テキストの書字方向を制御したい
テキストにルビをふりたい
箇条書きなどリストを表したい
セクションを定義したい
コンテンツをグループ化したい
画像や映像などを埋め込みたい
スクリプトやスタイルを埋め込みたい
フォーム関連の要素
テーブル関連の要素
ドキュメントにメタデータを付与したい
インタラクティブな要素
その他

このページの上部へ