トップページ  > HTML5  > <input>  > type="file"

★HTML5タグリファレンス

<input type="file"> …… サーバーへファイルを送信する
Internet Explorer4Internet Explorer5Internet Explorer5-macInternet Explorer5.5Internet Explorer6Internet Explorer7Internet Explorer8Internet Explorer9 Firefox1Firefox2Firefox3Firefox4 Google Chrome1Google Chrome2Google Chrome3Google Chrome4Google Chrome5Google Chrome6 Safari3Safari4Safari5 Opera6Opera7Opera8Opera9Opera10

<input>タグのtype属性でtype="file"を指定すると、 ファイル名の入力フィールドと[参照]ボタンが表示され、サーバーへ送信するファイルを選択できるようになります。 サーバー側にはファイルを受け取るためのプログラムが必要となります。

<input>タグにtype="file"を指定する場合、 <form>タグにはmethod="post"、および、enctype=" multipart/form-data"を指定するようにしてください。

■type="file"の場合に指定可能な属性

type="file"
サーバーへファイルを送信する
name属性
フォーム部品に名前をつける
size属性
フォーム部品のサイズを指定する
accept属性
type="file"の場合に、どのタイプのファイルがサーバ側で受け取ることができるかを指定
multiple属性
複数の値を入力・選択できるようにするHTML5から追加
required属性
入力必須にするHTML5から追加

■使用例

HTMLソース

<form action="cgi-bin/abc.cgi" method="post" enctype="multipart/form-data">
<p>
<input type="file" name="datafile">
</p>
<p>
<input type="submit" value="送信する">
</p>
</form>
↓↓↓

ブラウザ上の表示

▲ページ先頭へ
トップページ  > HTML5  > <input>  > type="file"
PR
MuuMuu Domain!
ドメイン取るならお名前.com
さくらのレンタルサーバ
ロリポップ!レンタルサーバー
HTMLクイックリファレンスについて
© HTMQ