複数ファイルのアップロードについて

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“超

仕事がはかどるJavaScript“超"活用術 AI、セキュリティ、クラウドを自動処理