多檔上傳的程式,可以分成兩個部份來解釋:
- 在網頁 HTML 的呈現方面需要用 Ajax 來即時呈現即將上載的檔案有那些。
- 將這些上載的檔案記載在陣列 Array 中,並逐一的上載到伺服器。
關於第一點,需要用到 Ajax 的技術,若對於 Ajax 不瞭解也沒有關係,我們可以使用一個免費的 JQuey 套件:Multiple File Upload Plugin (jQuery.MultiFile) ,套件可以從 http://www.fyneworks.com/jquery/multiple-file-upload 下載,或從或從 資訊空間 - 檔案下載 來取得。
使用的方法很簡單,只要將兩個 javascript 檔: jquery.js 及 jquery.MultiFile.js 含入,在 form 中加入 <input type="file" name="my_files[]" class="multi" /> 即可。因為 jquery.MultiFile.js 會將要上載的檔案資料記錄在陣列中,所以要用 name="my_files[]" 來作資料的接收;而 class="multi" 是 jQuery 用來作多檔案上傳程式碼置換點的判斷,HTML 檔案的部份如下: