複数ファイルのアップロードについて
multiple 属性を指定します。
<input type="file" name="file" multiple>
Ajaxを使わない
Ajaxを使わない方法、<form type="submit">
で複数ファイルのアップロードを行おうとすると制約に困るかもしれません。
<form type="submit">
だと例えば以下のようなことが行なえません。
- 特定ファイルの並び替えや削除
どうしても<form type="submit">
で行いたい場合、multiple 属性の指定を外します。
<input type="file" name="file">
参考までにファイルを削除する方法について
javascript - how to reset <input type = "file">
- Stack Overflow
Ajaxを使う
いわゆるAjax、XMLHttpRequest
を使用するほうが、FormData オブジェクト
やFileAPI
を利用できるため極力こちらを選択しましょう。
XMLHttpRequest の利用 - Web API インターフェイス | MDN
FormData オブジェクト
やFile API
をサポートしていないブラウザもサポートする場合は別途仕様を検討して費用をいただきましょう。
FormData - Web API インターフェイス | MDN
JavaScript でのローカル ファイルの読み込み - HTML5 Rocks
FormData オブジェクト
やFile API
が利用できるなら、いろいろできるのでユーザーが使いやすいアップロード機能を実装しましょう。
最速・最高のファイルアップロードに近づくための1歩 - Qiita
至高のファイルアップロード - Qiita
File API
以上です。
仕事がはかどるJavaScript“超"活用術 AI、セキュリティ、クラウドを自動処理
- 作者: クジラ飛行机
- 出版社/メーカー: 日経BP社
- 発売日: 2017/06/16
- メディア: 単行本
- この商品を含むブログを見る