HTML <input> accept 属性

定義と使用方法

accept 属性はユーザーがファイル入力ダイアログから選択できるファイルタイプにフィルタを設定します。

accept この属性はファイルアップロードを通じて提出できるファイルタイプを指定します。

注意:accept 属性は <input type="file"> 同時に使用。

ヒント:この属性を検証ツールとして使用しないでください。ファイルのアップロードはサーバーサイドで検証を行うべきです。

ユーザーがファイル入力ダイアログから選択できるファイルタイプを指定します:

<form action="/action_page.php">
  <label for="img">画像を選択してください:</label>
  <input type="file" id="img" name="img" accept="image/*">
  <input type="submit">
</form>

自分で試してみましょう

構文

<input accept="file_extension|audio/*|video/*|image/*|media_type">

ヒント:複数の値を指定する場合は、これらの値をコロンで区切ります(例 <input accept="audio/*,video/*,image/*" />

属性値

説明
file_extension ユーザーが選択できるファイルの拡張子を指定します(例:.gif、.jpg、.png、.docなど)
audio/* ユーザーはすべてのオーディオファイルを選択できます
video/* ユーザーはすべてのビデオファイルを選択できます
image/* ユーザーはすべての画像ファイルを選択できます
media_type

パラメータがなく、有効なメディアタイプです。

標準のメディアタイプの完全なリストを取得するには、IANA メディアタイプを確認してください。

ブラウザのサポート

表の数字は、その属性を完全にサポートする最初のブラウザのバージョンを示しています。

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
26.0 10.0 37.0 11.1 15.0