file（ファイル選択）

<input>タグの属性で、type="file"を指定した場合、送信するファイルを選択するフォームを定義することができます。ファイルを送信するフォームを使用する場合は、<form>タグのmethod属性でpostを指定し、enctype属性でmultipart/formdataを指定する必要があります。

type="file"を指定した場合に使用できる属性は以下のようになります。

accept属性

accept属性を使用すると、選択することのできるファイルの種類（MIMEタイプ）を指定することができます。

例えば、HTMLファイルを選択可能とするには、「accept="text/html"」とし、テキストファイル全般であれば「accept="text/*"」とすることで対応できます。「*」は「全ての」という意味です。

複数指定する場合は、「accept="image/jpg, image/gif, image/png"」のように「,」（カンマ）で区切ります。

name属性

name属性は、<input>要素に名前を付けます。ここで付けられた名前は、送信されたフォームを処理するプログラムなどから参照されます。type="file"を指定した場合、このname属性は必須となります。

プログラムから参照されるので、名前の付け方には注意が必要です。当然、日本語はダメで、記号等も使わないでください。また、最初の文字が数字にならないようにし、スペースが必要な場合は、代わりに「_」（アンダーバー）を使用するようにしてください。そうしないとプログラムでの処理に問題が発生する場合があります。

フォームでのname属性は、<a>タグ等で使用されるname属性とは役割が異なるものです。

disabled属性属性

disabled属性を指定すると、ファイル選択を使用不可にします。ブラウザには表示されるが、選択はできないという状態になります。

size属性

size属性は、選択されたファイルのパスを表示するテキストボックスの幅を指定します。ほとんどのブラウザでは、指定した数値が半角英数の文字数の分だけ表示される幅となります。このsize属性が指定されない場合は、ブラウザの初期値が適用されます。

入力例

入力例です。各属性の働きを確認してみてください。

input_file.html

onselect属性、onchange属性

onselect属性を指定すると、テキストボックスが選択されたときのブラウザの動作を指定することができ、onchange属性は、テキストボックスの値が変更されたときのブラウザの動作を指定します。ただし、これらの属性はJavaScriptに関することなのでこのサイトでは触れません。

reset

ページの先頭

hidden