Gombíkový prvok je flexibilnejší, ako by sa na prvý pohľad mohlo zdať. Existujú tri spôsoby, ako môžete použiť tlačidlo. Kľúčom k týmto rôznym režimom činnosti je atribút typu, ktorý má tri významy. Sú popísané v tabuľke.
Tabuľka 12-10: Hodnoty atribútu typu prvku tlačidla
V nasledujúcich častiach popíšem každú z týchto hodnôt a funkcie, ktoré ponúkajú.
Na odoslanie formulára použite tlačidlo
Ak je atribút typu nastavený na odoslanie, po kliknutí na tlačidlo sa odošle formulár, ktorý tlačidlo obsahuje. Toto je predvolené správanie, ak nie je použitý atribút typu. Keď použijete tlačidlo týmto spôsobom, získate prístup k niektorým ďalším atribútom, ktoré sú popísané v.
Tabuľka 12-11:Ďalšie atribúty, ktoré je možné použiť, ak je atribút typu nastavený na odoslanie
| Pripisovať | Popis |
| forma | Špecifikuje formulár (alebo formuláre), ku ktorému je tlačidlo priradené. Ďalšie informácie nájdete v časti „Práca s prvkami mimo formulára“ |
| formovanie | Prepíše atribút akcie prvku formulára a určuje novú adresu, na ktorú bude formulár odoslaný. Ďalšie informácie o atribúte akcie nájdete v časti „Prispôsobenie formulára pomocou atribútu akcie“ vyššie v tejto kapitole. |
| formenctype | Prepíše atribút enctype prvku formulára a určuje kódovanie údajov formulára. Ďalšie informácie o atribúte enctype nájdete v časti „Konfigurácia kódovania údajov“ vyššie v tejto kapitole. |
| formálna metóda | Prepíše atribút metódy prvku formulára. Ďalšie informácie o atribúte metódy nájdete v časti "Použitie atribútu metódy" v tejto kapitole. |
| formtarget | Prepíše cieľový atribút prvku formulára. Ďalšie informácie o cieľovom atribúte nájdete v časti "Špecifikácia cieľa pre odpoveď na formulár" vyššie v tejto kapitole. |
| aktualizovať formulár | Prepíše atribút novalidate elementu formulára, aby určil, či sa má vykonať validácia na strane klienta. Informácie o validácii nájdete v kapitole 14. |
Tieto atribúty vám väčšinou umožňujú zmeniť alebo doplniť konfiguráciu prvku formulára a špecifikovať akciu, metódu, schému kódovania, ciele a tiež kontrolovať validáciu na strane klienta. Tieto atribúty sú v HTML5 nové. Toto ukazuje, ako môžete tieto atribúty použiť na prvok tlačidla.
Zoznam 12-15: Použitie atribútov tlačidlového prvku
V tomto prípade som vynechal atribúty akcie a metódy elementu form a pridal som prispôsobenia pomocou atribútov formaction a formmethod prvku button.
Na resetovanie formulára použite prvok tlačidla
Ak nastavíte resetovanie atribútu type, potom sa po kliknutí na tlačidlo vynulujú všetky prvky zadávania údajov, ktoré sú vo formulári prítomné, a vrátia sa do pôvodného stavu. Pokiaľ sa týmto spôsobom používa prvok tlačidla, nie sú tu žiadne ďalšie atribúty. C ukazuje, ako pridať tlačidlo reset do dokumentu HTML.
Výpis 12-16: Na resetovanie formulára použite prvok tlačidla
Obrázok 12-12: Pridanie generického tlačidlového prvku
Veľa zdravia všetkým čitateľom môjho blogu! Pokračujeme v téme budovania html formulárov, dnes to zvážime vytváranie tlačidiel na webe s pomocou gombíková značka a jeho atribúty... V minulom článku som vám popísal, teraz poďme ďalej.
Predtým, ako budem pokračovať, chcem vás, milí čitatelia, varovať pred frivolným prístupom k osvojovaniu si jazyka html hypertextového značkovacieho kódu vo všeobecnosti a obzvlášť k jeho hlavným značkám. Aj pri použití moderných nástrojov na tvorbu webových stránok, ako je napríklad WordPress, nebude znalosť základov značkovacieho jazyka nadbytočná.
Navyše použitie týchto nástrojov na tieto účely ako vynikajúceho doplnku (mimochodom, najnovšie verzie ostatných už majú vstavané podobné funkcie) alebo robí tento proces zaujímavým a vzrušujúcim, pretože v mnohých ohľadoch robia život jednoduchšie pre správcu webu. No, teraz sa hneď budem venovať dnešnej téme.
Použitie značky tlačidla a jeho atribútov na vytváranie tlačidiel
Nezabudnite, že v minulom článku som písal o vytváraní tlačidiel na webe pomocou vstupnej značky a o použití jej najbežnejších (ktoré môžu mať tri hodnoty na vytváranie tlačidiel: tlačidlo, reset, odoslanie). Značka tlačidla (nesmie sa zamieňať s hodnotou atribútu type = „button“ vstupnej značky) môže ponúknuť oveľa širšie možnosti. Na tlačidlo namontované s jeho pomocou môžete umiestniť takmer akýkoľvek prvok vrátane obrázkov. Napríklad:
| Gombík s nápisom | Gombík s nápisom | |
| Obrazové tlačidlo |
Ďalej. Dokážete si asi predstaviť, že na rozšírenie funkčnosti konkrétnej značky formulára sa používa veľa atribútov, ktoré môžu nadobúdať určité hodnoty. Ďalej uvádzam príklady použitia niektorých atribútov značky tlačidla s potrebným vysvetlením.
1. Prístupový kľúč- atribút na definovanie klávesových skratiek, pomocou ktorých sa zameranie presunie na prvok formulára. Jednoducho povedané, na kliknutie na tlačidlo nie je potrebné naň presúvať kurzor myši, ale stačí stlačiť kláves, ktorého názov je nastavený pomocou tohto atribútu. Latinské písmená (a-z) alebo čísla (0-9). Napríklad nahradením hodnoty 1 a a získame klávesové skratky, pomocou ktorých môžete stlačiť tlačidlo.
Nezabudnite však, že rôzne prehliadače implementujú túto funkciu odlišne a používajú klávesové skratky. V tomto prípade (klávesové skratky 1 a a) v najpopulárnejších prehliadačoch vyzerá takto: Google Chrome () - Alt + 1, Alt + A; Firefox - Shift + Alt + 1, Shift + Alt + A; Opera (článok o bezplatnom sťahovaní, inštalácii, aktualizácii a konfigurácii prehliadača Opera) - Shift + 1, Shift + A; Internet Explorer - Alt + 1, Alt + A.
| 1 a |
2. automatické zaostrovanie- tento atribút vám umožňuje zamerať sa po načítaní stránky, to znamená, že môžete tlačidlo stlačiť bez toho, aby ste naň premiestňovali kurzor myši, napríklad pomocou tlačidla Enter na klávesnici. Všimnite si toho, že tu sa používa značka sady polí, na ktorú sa pozrieme neskôr.
3. zakázaný- pomocou tohto atribútu je prístup k tlačidlu a jeho zmena zablokovaná. Preto sa stane pre užívateľa nedostupným. Hodnota takého tlačidla nie je odoslaná do súboru obsluhy (skriptu).
| Aktívne tlačidlo Neaktívne tlačidlo |
4. forma- tento atribút sa používa na priradenie tlačidla k formuláru. Je to nevyhnutné v prípadoch, keď sa tlačidlo nenachádza vo vnútri značky formulára. Hodnota atribútu form je hodnota atribútu id značky formulára (napríklad id = „databáza“).
5. formenctype- tento atribút značky tlačidla vám umožňuje nastaviť metódu kódovania pri odosielaní údajov obsluhe a je určený tromi hodnotami:
- application / x-www-form-urlencoded-v tomto prípade sa pri kódovaní medzery nahradia +a namiesto ruských písmen sa zobrazia ich hexadecimálne hodnoty napríklad takto:% 2F% 3D%% 26% 3F% 2% 3D% 26% 3D
- multipart / form -data - pri použití tejto hodnoty nie sú údaje kódované
- text / obyčajný - namiesto medzier sa používa znamienko +, písmená a iné znaky nie sú kódované
Je potrebné poznamenať, že ak nie je nastavená hodnota atribútu formenctype, potom je predvolené nastavenie application / x-www-form-urlencoded, to znamená úplné kódovanie.
6. formovanie- tento atribút definuje adresu procesora formulárov (spravidla ide o súbor napísaný vo forme skriptu). Je to podobné.
7. formálna metóda- opäť, analogicky s ním, definuje spôsob prenosu údajov (získať alebo odoslať).
8. aktualizovať formulár- tento atribút ruší validáciu údajov, ktoré užívateľ zadal do formulára. Štandardne to nemá žiadny účinok. Táto kontrola sa vykonáva automaticky pri odosielaní formulára pre polia typu vstup = „e -mail“ a typ vstupu = „adresa URL“.
9. typ- určuje typ tlačidla podľa jeho funkcie. Vzhľad tlačidiel sa nijako nelíši, ale majú inú funkčnosť, ktorá je určená nasledujúcimi hodnotami:
- tlačidlo - bežné tlačidlo
- reset - tlačidlo na vymazanie údajov formulára a ich vrátenie do pôvodného stavu
- odoslať - tlačidlo na odoslanie údajov formulára obsluhe
10. názov- jedinečný názov tlačidla. Ak je na webe niekoľko rôznych tlačidiel a je potrebné ich oddeliť, použije sa tento atribút. Ako hodnota sa používa sada symbolov ich písmen alebo číslic.
Cieľom tohto príspevku bolo zoznámiť vás, milí čitatelia, so všetkými možnosťami, ktoré značka tlačidla a jeho atribúty poskytujú pri vytváraní tlačidiel na webe. Dúfam, že pre vás na túto tému nezostanú žiadne tmavé škvrny. Toto nie je posledná publikácia, pokračovanie bude určite nasledovať, takže sa môžete prihlásiť na odber aktualizácií
Inštrukcie
Použitie deskriptora pridá na stránku tlačidlo s názvom názvu a hodnoty. Atribút name dodáva prvku jedinečný identifikátor a používa ho procesor formulárov na určenie jeho hodnoty. Hodnota umiestni požadovaný text navrch. Ak chcete napríklad vytvoriť tlačidlo, napíšte nasledujúci kód:
Tento príkaz vytvorí tlačidlo s tlačidlom názov a nápisom „Odoslať“.
Deskriptor
Atribút formulára určuje identifikátor formulára, ktorý sa použije na spracovanie údajov. Formaction nastaví obslužný program formulára v inej časti dokumentu, inom súbore alebo na webe. Formmethod je zodpovedný za definovanie spôsobu prenosu údajov. Názov určuje názov tlačidla, typ - typ (normálny, na odosielanie údajov alebo na vymazanie formulára). Hodnota - hodnota, ktorú budú čítať skripty. Tlačidlo zobrazí obrázok so zadanou adresou a textom.
Ak chcete vytvoriť tlačidlo, ktoré bude spracovávať zadané údaje, musíte v atribúte zadať príslušný typ:
Ak chcete vytvoriť tlačidlo, ktoré vymaže vstup používateľa, zadajte typ = „reset“.
Poznámka
Deskriptor musí byť nevyhnutne použitý ako obsah značky