JavaScript如何利用Ajax上傳文件的方法介紹

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

實(shí)現(xiàn)文件的上傳主要有兩種方式：

使用form表單提交上傳

html代碼如下：

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

此時(shí)的JavaScript代碼如下：

需要注意：

1. processData設(shè)置為false。因?yàn)閐ata值是FormData對(duì)象，不需要對(duì)數(shù)據(jù)做處理。

2. <form>標(biāo)簽添加enctype="multipart/form-data"屬性。

3. cache設(shè)置為false，上傳文件不需要緩存。

4. contentType設(shè)置為false。因?yàn)槭怯?lt;form>表單構(gòu)造的FormData對(duì)象，且已經(jīng)聲明了屬性enctype="multipart/form-data"，所以這里設(shè)置為false。

使用FormData對(duì)象添加字段方式上傳文件

html代碼如下：

<p id="uploadp">
 <input id="file" type="file"/>
 <button id="upload" type="button">上傳</button>
</p>

JavaScript實(shí)現(xiàn)如下：

這里有幾處不一樣：

聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com