本文介紹了JavaScript使用Ajax上傳文件的示例代碼，分享給大家，具體如下：

實現文件的上傳主要有兩種方式：

使用form表單提交上傳

html代碼如下：

<form id="uploadForm" enctype="multipart/form-data">  <input id="file" type="file" name="file"/>  <button id="upload" type="button">上傳</button></form>

此時的JavaScript代碼如下：

 var formData = new FormDate($('#uploadForm')[0]); $.ajax({        url: 'http://10.10.2.254:8080/file/associateupload',        type: 'POST',        cache: false,        data: formData,        processData: false,        contentType: false,        success:function(res){            console.log(res);        }    });

需要注意：

processData設置為false。因為data值是FormData對象，不需要對數據做處理。 <form>標簽添加enctype="multipart/form-data"屬性。 cache設置為false，上傳文件不需要緩存。 contentType設置為false。因為是由<form>表單構造的FormData對象，且已經聲明了屬性enctype="multipart/form-data"，所以這里設置為false。

使用FormData對象添加字段方式上傳文件

html代碼如下：

<div id="uploadDiv">  <input id="file" type="file"/>  <button id="upload" type="button">上傳</button></div>

JavaScript實現如下：

var formData = new FormData();formData.append('file', $('#file')[0].files[0]);$.ajax({  url: '/upload',  type: 'POST',  cache: false,  data: formData,  processData: false,  contentType: false,  success:function(res){     console.log(res);  }

這里有幾處不一樣：

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持錯新站長站。