Vytváření tlačítek pomocí vstupních značek HTML ve formulářích

click fraud protection

Vytvářejte přizpůsobitelná textová tlačítka v HTML za použití vstup štítek. The vstup prvek se používá v rámci formulář živel.

Nastavením atributtyp na „tlačítko“ vygeneruje jednoduché tlačítko, na které lze kliknout. Text, který se zobrazí na tlačítku, například „Odeslat“, můžete definovat pomocí hodnota atribut. Například:


The vstup značka nebude odesílat formulář HTML; musíte zahrnout JavaScript zpracovat odeslání dat formuláře. Bez JavaScriptu při kliknutí událost, tlačítko se bude jevit jako klikatelné, ale nic se nestane a vy budete frustrovaní čtenáři.

Alternativa značky „tlačítko“

Ačkoli pomocí vstup značka pro vytvoření tlačítka funguje pro svůj účel, je lepší použít knoflík značka pro vytvoření tlačítek HTML vašeho webu. The knoflík Značka je flexibilnější, protože umožňuje používat obrázky pro tlačítko (což vám pomůže zachovat vizuální konzistenci, pokud je vaše web má například motiv designu) a lze jej definovat jako typ tlačítka pro odeslání nebo resetování, aniž byste potřebovali nějaké další JavaScript.

instagram viewer

Určete tlačítko typ atribut v libovolném knoflík značky. Existují tři různé typy:

  • knoflík: Tlačítko nemá žádné inherentní chování, ale používá se ve spojení se skripty spuštěnými na straně klienta, které lze připojit k tlačítku a spustit po kliknutí.
  • resetovat: Obnoví všechny hodnoty.
  • Předložit: Tlačítko odešle data formuláře na server (toto je výchozí hodnota, pokud není definován žádný typ).

Mezi další atributy patří:

  • název: Dává tlačítku referenční název.
  • hodnota: Určuje hodnotu, která má být původně přiřazena tlačítku.
  • deaktivovat: Vypne tlačítko.

Jít dále s tlačítky

HTML5 přidává do souboru další atributy knoflík značka, která rozšiřuje jeho funkčnost.

  • autofokus: Když se stránka načte, tato možnost určuje, že toto tlačítko je aktivní. Na stránce lze použít pouze jedno automatické zaostřování.
  • formulář: Přidruží tlačítko ke konkrétnímu formuláři ve stejném dokumentu HTML, přičemž jako hodnotu použije identifikátor formuláře.
  • formování: Používá se pouze s type = "odeslat" a adresa URL jako hodnota určuje, kam se budou odesílat údaje formuláře. Často je cílem PHP skript nebo něco podobného,
  • formenctype: Používá se pouze s type = "odeslat" atribut. Definuje, jak se mají data formuláře kódovat při odeslání na server. Tyto tři hodnoty jsou application / x-www-form-urlencoded (výchozí), vícedílné / formulářové údaje,text / prostý.
  • metoda: Používá se pouze s type = "odeslat" atribut. Toto určuje, kterou metodu HTTP použít při odesílání dat formuláře dostat nebo pošta.
  • formnovalidate: Používá se pouze s type = "odeslat" atribut. Data formuláře nebudou při odeslání ověřena.
  • cíl cíle: Používá se pouze s type = "odeslat" atribut. To označuje, kde by se měla zobrazit odpověď webu při odeslání dat formuláře, například v novém okně atd. Možnosti hodnot jsou buď_blank, _self, _parent, _top, nebo konkrétní název rámce.

Přečtěte si více o vytváření tlačítek ve formátech HTML, a jak udělat váš web uživatelsky přívětivějším.

instagram story viewer