1. 程式人生 > >jquery運用FormData結合Ajax非同步上傳表單,超實用

jquery運用FormData結合Ajax非同步上傳表單,超實用

首先建立一個formData,其中引數,就是你的form表單,jquery要加0,也可以用document.querySelector("form")得到

var formData = new FormData($("form")[0]);

接著就是非同步上傳了,其中一定要設定兩個值為falese,就是下面的contentType和processData,使之可以上傳檔案,並不要轉成字串形式,這也是為什麼要用$.ajax而不用$.post的原因

$.ajax({ 
    url: "/base/test",
    type: 'POST', 
    data: formData, 
    contentType: 
false, processData: false, success: function (returndata) { console.log(returndata); }, error: function (returndata) { console.log(returndata); } });

上面的url,自行設定,是你要處理的連結。使用這種方法的好處就是不用通過FileReader讀取,再轉換資料!不過為了實時顯示圖片,也可以結合filereader使用