2012-08-09 201 views
1

我知道使用常規的Ajax調用不可能上傳文件,所以我想用jQuery文件上傳插件來模擬這個過程。我有一個表單,允許用戶輸入具有3個名爲male_image,female_image和neutral_image的文件輸入的項目的數據。我想在我的Ajax調用的成功回調中上傳全部3個輸入中的文件。使用文件上傳jQuery插件在Ajax調用中上傳多個文件

$.ajax({ 
     type: "POST", 
     url: "/manage/processadditem", 
     data: $("#add_form").serialize(), 
     dataType: "html", 
     success: function(response, textStatus, XHR) 
     { 
     if(response.indexOf('invalid') >= 0 || response.indexOf('Exception') >= 0){ 
      //Show them their errors 
      alert(response); 
     } 
     else{ 
      //Data was good 
      //Upload male_/female_/neutral_image to /manage/items/itemimage 
      //for further processing 
     } 

     } 
    }); 

我已經在背面設置了處理圖像的代碼,我只需要把它們放在那裏。我能找到的所有多個文件輸入插件似乎可以處理從單個輸入發送多個文件。我怎樣才能從多個文件輸入中發送一個文件,這樣我就可以在後端將它們區分開來?

+0

你的理解是有點瑕疵,這是完全可以做到上傳使用AJAX多個文件。這裏是一篇文章:http://net.tutsplus.com/tutorials/javascript-ajax/uploading-files-with-ajax/ – Vap0r 2012-08-09 15:31:58

+0

@ Vap0r它看起來像fileReader幾乎支持所有網站瀏覽器的目標,但什麼關於FormData對象? – jaimerump 2012-08-09 15:41:55

+1

自從我有這方面的經驗以來,這已經很長時間了。但我相信這是做這件事的最新方法之一,但我認爲你需要一個iframe後備。你可以使用jquery的文件上傳插件,但我沒有經驗來幫助你。我只想指出,您實際上可以使用AJAX上傳文件。 (這就是jquery上傳插件無論如何!) – Vap0r 2012-08-09 15:47:17

回答

2

您可以使用此jquery upload並上傳多個文件,這個例子很容易

+0

我一直在努力與其他插件做這個爲期兩天,現在我得到了這個啓動和運行只需幾分鐘。非常容易使用。 – jaimerump 2012-08-11 21:59:37