資訊專欄INFORMATION COLUMN
摘要：下邊舉個(gè)例子，大家就明白了好了，請(qǐng)上我們的兩位同學(xué)，小明和胖虎，你們就不用發(fā)言了，我會(huì)以的形式介紹你們的情況和個(gè)人癖好，請(qǐng)坐。
先介紹js的FormData，F(xiàn)ormData是XMLHttpRequest Level 2新增的一個(gè)接口，利用FormData對(duì)象,我們可以通過(guò)JavaScript用一些鍵值對(duì)來(lái)模擬一系列表單控件,我們還可以使用ajax方法來(lái)異步的提交這個(gè)"表單".使用FormData的最大優(yōu)點(diǎn)就是我們可以異步上傳一個(gè)二進(jìn)制文件.
這里說(shuō)下FormData的append方法，
void append(DOMString name, Blob value, optional DOMString filename); void append(DOMString name, DOMString value);參數(shù)值
字段名稱.
字段值.可以是,或者一個(gè)字符串,如果全都不是,則該值會(huì)被自動(dòng)轉(zhuǎn)換成字符串.
(可選) 指定文件的文件名,當(dāng)value參數(shù)被指定為一個(gè)Blob對(duì)象或者一個(gè)File?接口提供有關(guān)文件的信息，并允許網(wǎng)頁(yè)中的 JavaScript 訪問(wèn)其內(nèi)容。")對(duì)象時(shí),該文件名會(huì)被發(fā)送到服務(wù)器上,對(duì)于Blob對(duì)象來(lái)說(shuō),這個(gè)值默認(rèn)為"blob".
這里要注意下value字段，如果你要填入的是一個(gè)對(duì)象，會(huì)將它轉(zhuǎn)換成字符串，也就是最后傳給后臺(tái)的都是[object object]，這樣后臺(tái)當(dāng)然是無(wú)法解析的。下邊舉個(gè)例子，大家就明白了
好了，請(qǐng)上我們的兩位同學(xué)，小明和胖虎，你們就不用發(fā)言了，我會(huì)以json的形式介紹你們的情況和個(gè)人癖好，請(qǐng)坐。
var json=[
{"name":"小明","age":15,"skills":["抽煙","喝酒","燙頭"],"family":{"father":"大明","mohter":"小紅"}},
{"name":"胖虎","age":17,"skills":["打架","打架","還是打架"],"family":{"father":"佐藤","mohter":"愛田"}},
]
首先我們先試一下，把小明的family對(duì)象傳給后臺(tái)。
var data=new FormData()
data.append("family",json[0].family)
$.ajax({
url:"demo.php",
type: "Post",
dataType: "json",
cache: false,//上傳文件無(wú)需緩存
processData: false,//用于對(duì)data參數(shù)進(jìn)行序列化處理 這里必須false
contentType: false, //必須
data:data,
success:function (res) {
console.log(res);
},
error:function (error) {
console.log(error);
}
})
結(jié)果：
被解析成了object object，有人該說(shuō)了，你把它用JSON.stringify序列化之后不就行了，然后后端配合，再解碼成json，對(duì)，這樣確實(shí)行，但不要忘了，咱們還是需要傳文件流的，文件流被序列化之后會(huì)被轉(zhuǎn)化成一個(gè)空對(duì)象，這樣后臺(tái)就無(wú)法識(shí)別。由于時(shí)間原因，這里就不演示反面案例了。
這里我們要用兩個(gè)語(yǔ)法
1.a["b"]等于a.b
2.c[0]取得是c數(shù)組的第一項(xiàng)
正確方法：
