Tento zápis demonštruje objekt FormData v JavaScripte pomocou najjednoduchších príkladov.
Čo je objekt FormData v JavaScripte?
Objekt FormData je populárny prístup k vytváraniu zberu údajov v jazyku JavaScript, ktorý možno odoslať na server pomocou „ XMLHttpRequest “ alebo načítané. Vykonáva rovnaké funkcie ako prvok formulára HTML. Dá sa to porovnať s radom polí. Samostatné pole predstavuje každý prvok, ktorý chceme preniesť na server.
Syntax
Ak chcete použiť objekt FormData v jazyku JavaScript, použite nasledujúcu syntax:
konšt formData = Nový FormData ( ) ;
Príklad 1: Vytvorte objekt FormData bez formulára HTML
Najprv inicializujte konštantu s konkrétnym názvom a priraďte tejto konštante konkrétnu hodnotu. Tu je „ new FormData() “ sa používa ako konštantná hodnota:
Konšt formData = Nový FormData ( ) ;
Potom pridajte údaje odovzdaním argumentov v „ pripojiť () “
formData. priložiť ( 'Fname' , 'dôstojník' ) ;formData. priložiť ( 'meno' , 'Javed' ) ;
formData. priložiť ( 'Vek' , 25 ) ;
Potom použite „ console.log() “ metóda:
konzoly. log ( 'Informácie z formulára' ) ;
Použi ' pre ” slučka na iteráciu a zobrazenie výstupu na konzole pomocou “ console.log() “ metóda:
pre ( nech obj of formData ) {konzoly. log ( obj ) ;
}
Príklad 2: Vytvorenie objektu FormData pomocou formulára HTML
Ak chcete pridať FormData s formulárom HTML, najprv vytvorte formulár v HTML pomocou „ ” a pridajte nasledujúci atribút uvedený nižšie:
- Ak chcete pridať vstupné pole do formulára, použite „
' element. - Vo vnútri vstupnej značky zadajte „ typu ” na definovanie dátového typu prvku. Pre tento atribút existuje viacero možných hodnôt vrátane „ text “, “ číslo “, “ dátum “, “ heslo ', a mnoho ďalších.
- ' zástupný symbol “ sa používa na pridanie hodnoty, ktorá sa má zobraziť vo vstupnom poli, a „názov“ sa vzťahuje na názov vstupného poľa.
- “ po kliknutí ” udalosť sa spustí, keď používateľ vykoná funkciu kliknutím myšou:
< typ vstupu = 'text' názov = 'Fname' zástupný symbol = 'Zadajte svoje krstné meno' < br < br >
< typ vstupu = 'text' názov = 'meno' zástupný symbol = 'Zadajte svoje priezvisko' < br < br >
< typ vstupu = 'dátum' názov = 'Vek' zástupný symbol = 'Zadajte svoj vek' < br < br >
< typ vstupu = 'tlačidlo' hodnotu = 'Enter' po kliknutí = 'data()' >
formulár >
Ďalej prejdite k formuláru v CSS a nastavte priestor okolo formulára:
. formulár {marža : 20 pixelov ;
vypchávka : 30 pixelov ;
}
Okrem toho použite značku skriptu a pridajte nasledujúci kód:
funkčné údaje ( ) {bola forma = dokument. getElementById ( 'forma' ) ;
constformData = newFormData ( formulár ) ;
konzoly. log ( 'Údaje formulára' ) ;
pre ( nech obj offormData ) {
konzoly. log ( obj ) ;
}
}
Vo vyššie uvedenom útržku kódu:
- Vyvolajte „ getElementById(“formulár”) ” na prístup k formuláru pomocou ID formulára.
- Teraz uložte prístupný prvok do novej konštanty „ formData “.
- Použi ' pre ” slučku pre iteráciu a vytlačte prvky na konzole.
Výkon
Dozvedeli ste sa o vytvorení objektu FormData v JavaScripte.
Záver
Objekt FormData sa používa na vytvorenie kolekcie údajov v jazyku JavaScript, ktoré možno odoslať na server. Na vytvorenie objektu Formdata v JavaScripte sú demonštrované dve metódy. Prvým je použitie jednoduchého JavaScriptu a druhým je vytváranie formulárov v HTML a ich prepojenie s JavaScriptom. Tento príspevok uvádzal objekty FormData v JavaScripte.