[b][color=green][size=large]近來，專案有個小需求需要使用到ajax非同步上傳檔案，本來ajax是不支援上傳檔案的，但是可以通過iframe技術模擬實現，非同步提交，原理實際上就是利用了乙個隱藏的iframe子窗體，把提交的表單的target指向這個隱藏的窗體，在提交時，瀏覽器的頭部還會出現載入資訊，但是頁面卻沒有任何重新整理，勉強實現了ajax的非同步上傳。
好了，下面開始進入正題，散仙簡單記錄下，究竟該怎麼使用ajax非同步上傳檔案，在實現的過程中，也遇到了一些小問題，總算皇天不負有心人，都一一解決，今記錄在此，免後繼者重蹈折。
[/size][/color][/b]
[b][color=olive][size=large]實現這個功能，需要jquery的乙個js檔案，如下所示：[/size][/color][/b]
ajaxfileupload.js[b][color=olive][size=large]首先，我們需要把這個包匯入工程中，當然還得有jquery的核心包，然後我們就可以使用ajax上傳的功能了，**如下：[/size][/color][/b]
[b][color=olive][size=large]散仙的後台是struts2的action，後台就是我們常規的一些寫法,因為使用了ajax提交，所以就沒必要在前台**裡寫入form表單來提交了，後台部分**如下：[/size][/color][/b]
/**
* 上傳的檔名
* **/
public listupload;
private listuploadfilename;//注意要與檔名一致
private listuploadcontenttype;//檔案型別一致
[b][color=green][size=large]然後，就可以正常使用了。
使用過程中，發現2個問題：
問題一，在使用ajax上傳時，datatype型別，最好寫成大寫的json，散仙一開始的時候寫的小寫結果，發現不能正常使用，可能是乙個bug。
解決辦法就是把datatype的值寫成大寫的json，即可。
問題二, 在json的集合資料返回到前台是，資料上莫名其妙的帶了個pre的html標籤，導致無法正常解析json，這個異常散仙在網上也找了一些解決辦法，通常的是把後台的setcontenttype裡面設定頭部資訊為text/html，經過此步，pre標籤的問題是可以解決了
但是在前台的時候，仍不能正常顯示，最後改了ajaxfileupload.js的原始碼，此問題得以解決。
解決辦法如下圖所示：
[/size][/color][/b]
[img]
[b][color=green][size=large]至此，所有問題都得到解決，最後散仙附上ajaxfileupload.js檔案，希望能夠對正在使用中的朋友有所幫助。
[/size][/color][/b]
Ajax檔案非同步上傳
ajax檔案非同步上傳 註明 既然有了表單上傳為什麼又要ajax上傳呢？因為表單上傳過程中，整個頁面就重新整理了！ajax非同步上傳就可以達到只重新整理區域性位置 選擇檔案 type file id file1 type button id upload value 上傳 src wait.gif ...
AJAX非同步上傳檔案
定義form表單 定義ajax非同步上傳邏輯 form表單提交按鈕定義 function upload updategoods 設定監聽 獲取檔案上傳進度 xhr.upload.onprogress function a 設定監聽 獲取響應內容 xhr.onreadystatechange func...
Spring使用Ajax非同步上傳檔案
2.多檔案上傳 檔案上傳 type file id file name filename 建立formdata物件，用於儲存ajax上傳的引數資訊 var formdata newformdata 獲取要上傳的檔案file var files document.getelementbyid file...