Ako vytvoriť HTML formuláre?
1. Pridajte značku FORMULÁR do svojho HTML.
2. Pridajte akciu do značky FORM.
3. Pridajte možnosti formulára.
4. Ukončite značku FORMULÁR.
Skvelý spôsob, ako rozšíriť znalosti HTML formulárov, je prehliadať webovú stránku HTML formulárov W3school.
Do existujúceho dokumentu HTML môžete pridať formulár do značiek <form> </form>. Tieto značky slúžia ako kontajner pre všetky vaše údaje vo formulári, ako sú textové polia, zoznamy a tlačidlá. Keď niekto odošle informácie prostredníctvom vášho formulára, údaje budú odoslané na server, ktorý uloží, spracuje, odošle alebo zobrazí výsledky na základe obsahu. Naučte sa nastaviť značku <form> tak, aby váš formulár robil to, čo chcete, a tiež ako pridať vstupy na zhromažďovanie informácií.
Časť 1 z 3: Vytvorenie značky formulára
- 1Otvorte dokument HTML v textovom editore, ktorý uprednostňujete. Obsah formulára HTML musí byť zadaný do značiek <form> a </form>. Tieto značky fungujú ako kontajner pre váš formulár, podobne ako ostatné značky kontajnerov, ako sú <div> </div> a <table> </table>
- Vo značkách <form> </form> môžete použiť CSS alebo HTML, aby váš formulár vyzeral tak, ako chcete.
- 2Otvorte <form> prvok. Formulár spustíte tak, že v súbore prejdete na miesto, kde by mal formulár začínať, a <form> do jeho riadka napíšte. Táto značka znamená začiatok vášho formulára.
- 3Pridajte do <form> značky atribút „action =“. Značke to hovorí, <form> čo má robiť s údajmi formulára. Definujete to pridaním action="path_to_script" do <form> značky.
- Napríklad: <form action="/cgi-bin/myformscript.pl">(ak je skript, ktorý bude analyzovať údaje formulára, umiestnený v adresári na vašom serveri s názvom „cgi-bin“).
- Ak je skript na inom serveri: <form action="">
- Ak chcete odoslať údaje z formulára na e -mailovú adresu (nie na skript): <form action="mailto:you@yourdomain.com" enctype="text/plain">
- 4Rozhodnite, akým spôsobom sa budú údaje formulára odosielať. Teraz, keď ste definovali, kam sa budú údaje formulára odosielať, musíte sa rozhodnúť, či váš formulár údaje „ZÍSKA“ alebo „POST“. Potom do značky pridáte ako method atribút „GET“ alebo „POST“ <form>.
- Slúži method="get" na vyžiadanie údajov zo zdroja. Na získavanie údajov by ste mali používať iba GET. Nikdy nepoužívajte GET s citlivými informáciami, ako sú heslá alebo čísla sociálneho poistenia.
- Slúži method="post" na odoslanie údajov, ktoré sa majú spracovať. Túto možnosť použite, ak sú údaje vo formulári citlivé, napríklad pre heslá alebo čísla kreditných kariet.
- Konečný výsledok by mal mať tento formát: <form action="/cgi-bin/myformscript.pl" method="post">
Obsah formulára HTML musí byť zadaný do značiek a.
Časť 2 z 3: pridanie možností formulára
- 1Vytvorte textové pole pomocou <input type="text" />. Môžete pridať prázdne pole, do ktorého môžu vaši návštevníci napísať svoje mená, komentáre alebo čokoľvek iné, čo budete potrebovať. Začnite to na novom riadku za značkou <form>.
- Napríklad, First Name: <input type="text" id="name" /> vytvorí textové pole s predbežným "Krstné meno", aby používatelia vedeli, čo písať do poľa.
- Zmeňte hodnotu „id =“ (v príklade „názov“) tak, aby zodpovedala tomu, čo robíte s údajmi. Ak sú údaje odoslané do skriptu, táto hodnota by mala zodpovedať niečomu v skripte.
- 2Vytvorte pole pre heslo. Ak váš skript požaduje, aby používateľ zadal heslo, pridáte ďalší <vstup />, tentokrát s atribútom „typ“ nastaveným na „heslo“.
- Na nový riadok napíšte Password: <input type="password" name="password" />
- 3Možnosti získate pridaním prepínačov. Ak chcete, aby si návštevníci vyberali zo zoznamu položiek, vytvorte zoznam možností pomocou prepínačov. Na tento účel použijete značku <input /> s atribútom „type“ nastaveným na „radio“.
- Ak chcete vytvoriť prepínače na výber „Pes“ alebo „Mačka“:
- <input type="radio" name="pets" value="dog" /> Dog
- <input type="radio" name="pets" value="cat" /> Cat
- Skupina prepínačov by mala mať rovnaký atribút „name“.
- Ak chcete vytvoriť prepínače na výber „Pes“ alebo „Mačka“:
- 4Získajte ďalšie pokročilé možnosti formulárov. Existuje toľko typov vstupov a zoznamov, ktoré môžete zahrnúť do svojho formulára. Skvelý spôsob, ako rozšíriť znalosti HTML formulárov, je prehliadať webovú stránku HTML formulárov W3school. Okrem toho existuje mnoho užitočných článkov sprievodcu, ktoré vás prevedú nastavením položiek, ako sú voliteľné zoznamy, tlačidlá resetovania/vymazania a začiarkavacie políčka.
Vnútri značiek môžete do existujúceho dokumentu HTML pridať formulár.
Časť 3 z 3: Zatvorenie formulára
- 1Vytvorte odoslanie <tlačidlo>. Keď váš návštevník vyplní formulár, bude ho musieť odoslať kliknutím na tlačidlo Odoslať. Tu je príklad:
- <button type="submit">Send your message</button>
- „Odoslať správu“ nahraďte textom, ktorý sa má zobraziť na tlačidle.
- 2Napíšte </form> na koniec formulára. Táto značka označuje, že formulár je ukončený. Nezabudnite, že všetok obsah formulára musí byť vo vnútri <form> a </form>.
- 3Nahrajte dokument na svoj webový server. Teraz, keď ste do dokumentu HTML pridali formulár, nahrajte ho na svoj webový server a vyskúšajte ho!
- Značky <fieldset> </fieldset> môžete umiestniť okolo skupiny prvkov formulára a zoskupiť ich do samostatného poľa.
- Pretože väčšina HTML sa stala XHTML, značka <input> by mala obsahovať (pred koncovou zátvorkou) medzeru a spätné lomítko. Napríklad: <input type = "submit" />
Prečítajte si tiež: Ako hacknúť účet Hotmail?
Otázky a odpovede
- Ako odošlem spätnú väzbu/odpovede na formulár na moju webovú stránku?To závisí od toho, čo chcete so spätnou väzbou urobiť. Vo väčšine prípadov budete musieť použiť
- Ako môžem odstrániť nadbytočné miesto za značkou?Tento priestor tam automaticky vloží prehliadač, ktorý používate. Aby ste sa toho zbavili, musíte použiť CSS. Toto je jazyk používaný na manipuláciu so vzhľadom webových stránok. Dobré návody na CSS nájdete na webových stránkach ako Codecademy a W3Schools, ale sprievodca má aj dobré vysvetlenia.
