FormData on põhjalik sissejuhatus ja kasutus https://developer.mozilla.org/zh ... ng_FormData_Objects
FormData meetodid ja sündmused on seal juba väga selged, nii et ma ei raiska neile siin aega. See artikkel selgitab peamiselt FormData objektide ja asünkroonsete failiüleslaadimiste kasutamist.
FormData objekt võimaldab meil korraldada võtme-väärtuse paaride kogumi, mis saadetakse XMLHttpRequest objekti abil. Seda kasutatakse peamiselt vormiandmete saatmiseks, kuid seda saab kasutada ka sõltumatult vormide kaudu edastatud andmetest.
1. Loo FormData objekt nullist
Saad luua oma FormData objekti ja lisada objektile võtme-väärtuse paarid append() meetodi abil, näiteks nii:
Märkus: Nii väljad "userfile" kui ka "webmasterfile" sisaldavad faile. Väljale "accountnum" määratud number teisendatakse otse stringiks meetodi FormData.append() abil (välja väärtus võib olla blob, fail või string: kui väärtus ei ole ei blob ega fail, teisendatakse väärtus stringiks). See näide loob FormData eksemplari väljadega "username", "accountnum", "userfile" ja "webmasterfile" ning seejärel kasutab XMLHttpRequest objekti send() meetodit vormiandmete saatmiseks. Väli "webmasterfile" on laik. Blob-objekt esindab failiobjekti toorandmeid. Kuid blobi poolt esitatud andmed ei pea olema javascripti natiivses formaadis. Faililiides põhineb blobidel, pärides blobi funktsionaalsust ja laiendades kasutajafailisüsteemide tuge. Blobi ehitamiseks saab kutsuda Blob() konstruktorit.
2. Hangi FormData objekt HTML-vormist
Selleks, et saada FormData objekt, mis sisaldab olemasolevaid vormiandmeid, tuleb FormData objekti loomisel määrata vormielement.
Nagu see:
Pärast FormData objekti saamist saad lisada ka täiendavaid andmeid, näiteks nii:
See võimaldab lisada täiendavat infot enne saatmist, mitte tingimata kasutaja poolt muudetud.
3. Kasutage faili saatmiseks FormData objekti
FormData abil saab faile saata. Lihtne <form>keskmine võib <input>sisaldada elementi:
Seejärel saate selle saatmiseks kasutada järgmist koodi:
Saad lisada ka faili või blobi otse FormData objektile, näiteks nii:
Append() meetodi kasutamisel võib failinime saatmiseks kasutada kolmandat parameetrit (saadetakse serverile Content-Disposition päise kaudu). Kui kolmandat parameetrit pole määratud või seda ei toetata, on kolmas parameeter vaikimisi "blob".
Kui seadistad õiged valikud, saad seda kasutada ka jQueryga:
|