摘要:利用對象,我們可以通過用一些鍵值對來模擬一系列表單控件,我們還可以使用的方法來異步的提交表單。與普通的相比,使用的最大優(yōu)點就是我們可以異步上傳二進制文件。
每次在向服務(wù)器提交文件對象數(shù)據(jù)是,總是需要借助各種三方插件來實現(xiàn)表單異步提交功能,還要為不同的界面去定制不同的插件css,相當(dāng)繁瑣。XMLHttpRequest Level 2 添加了一個新的接口——FormData。利用 FormData 對象,我們可以通過 JavaScript 用一些鍵值對來模擬一系列表單控件,我們還可以使用 XMLHttpRequest 的 send() 方法來異步的提交表單。與普通的 Ajax 相比,使用 FormData 的最大優(yōu)點就是我們可以異步上傳二進制文件。
話不多說直接上代碼:
var formData = new FormData(); formData.append("template", that.template); formData.append("declare", that.declareData.declare); formData.append("self_intro", that.declareData.self_intro); formData.append("plan_name", that.declareData.plan_name); //$("#business_plan") 是一個file類型的input對象 formData.append("business_plan", $("#business_plan")[0].files[0]); var xhr = new XMLHttpRequest(); xhr.open("POST", url, true); xhr.setRequestHeader("Accept", "application/json"); xhr.send(formData); // 指定通信過程中狀態(tài)改變時的回調(diào)函數(shù) xhr.onreadystatechange = function () { // 通信成功時,狀態(tài)值為4 var completed = 4; if (xhr.readyState === completed) { if (xhr.status === 200) { // 處理服務(wù)器發(fā)送過來的數(shù)據(jù) var result = JSON.parse(xhr.responseText); //這里你可以隨意的處理這個result對象了 //... } else {// 處理錯誤 alert("連接超時"); } } };
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://specialneedsforspecialkids.com/yun/78999.html
摘要:簡介業(yè)務(wù)做一個在線投票,給歌手投票。提交到當(dāng)前頁面的中達(dá)到效果。用戶名密碼注冊總結(jié)在不使用對象的情況下,依然可以用來實現(xiàn)對后臺服務(wù)器的請求,同時不帶來頁面刷新或者跳轉(zhuǎn)。 ajax 簡介 業(yè)務(wù):做一個在線投票,給歌手投票。要求:無刷新,并且不允許使用XMLHttpRequest對象.分析:在XHR對象,沒有流行之前,已經(jīng)有了無刷新這種效果的方法. 從http角度看,可以利用204 No...
摘要:在表單提交時,瀏覽器會自動進行一系列的校驗工作,沒有通過校驗的表單是無法提交到服務(wù)器的。而方法提交表單,會在請求中發(fā)送表單字段鍵值對。表單提交事件表單提交到服務(wù)器時,會觸發(fā)事件。 上一篇主要溫習(xí)了一下form表單的屬性和表單元素,這一片主要講解用JavaScript如何操作form。 表單操作 取值 用JavaScript操作表單,免不了會有取值賦值操作,比如有以下表單: ...
閱讀 747·2021-07-25 21:37
閱讀 3660·2019-08-30 15:55
閱讀 2574·2019-08-30 15:54
閱讀 1722·2019-08-30 15:44
閱讀 3126·2019-08-30 15:44
閱讀 864·2019-08-30 15:43
閱讀 1031·2019-08-29 15:36
閱讀 3044·2019-08-29 10:58