[新着] Webテンプレートを仮オープンしました
inputタグに type="file" を指定すると、ファイルをアップロードするための入力欄を作成できます。
<input type="file" name="upfile" size="30">
| name="" | フィールド名を指定します(一般的には半角英数字) |
|---|---|
| size="" | 入力フィールドの横幅を数値で指定します |
■name="" (フィールド名を指定する)
入力項目を判別するための名前です。項目ごとに違う名前を指定します。
■size="" (入力フィールドの横幅を指定する)
入力欄の横幅を数値で指定します。
サイズを指定した場合でも、ブラウザにより見た目の長さは異なります。同じような長さで表示したい場合は、スタイルシートで指定します。
【使用方法】
type="file" を指定すると、自動的に「参照...」ボタンが表示されます。
このボタンをクリックすると、ファイルを選択するためのウィンドウが表示され、選択を完了するとそのファイルへのパスが入力欄に挿入されます。
※ファイルを送信するフォームでは、enctype属性 に multipart/form-data を指定する必要があります。
※送信されたファイルをサーバー側で受け取るには、その機能を持ったCGI等のプログラムが必要です。
![]()
入力欄のサイズや背景色等は、スタイルシートでアレンジすることもできます。指定方法の詳細は「関連ページ」をご覧ください。
<form method="POST" action="example.cgi" enctype="multipart/form-data">
<p>
標準
<br>
<input type="file" name="example1">
</p>
<p>
横幅を40に指定
<br>
<input type="file" name="example2" size="40">
</p>
<p><input type="submit" value="送信する"></p>
</form>
▼これをブラウザで見ると次のように表示されます
※サンプルのため送信できません