Gebruik die HTML Input Tag en Button Tag in Forms

U kan aanpasbare teksknoppies in HTML maak met die tag. Die element word binne 'n

-element gebruik.

Deur die kenmerk tipe op "knoppie" te stel, sal 'n eenvoudige klikbare knoppie gegenereer word. U kan die teks wat op die knoppie verskyn, soos "Submit" definieer deur die waarde kenmerk te gebruik.

Byvoorbeeld:

Wees bewus daarvan dat die -tag nie 'n HTML-vorm sal inhandig nie; Jy sal nog steeds JavaScript moet insluit om die vorm data voorlegging te hanteer. Sonder 'n JavaScript onclick- gebeurtenis sal die knoppie klikbaar wees, maar niks sal gebeur nie, en jy sal jou lesers gefrustreer het.

Die Tag Alternatief

Alhoewel die gebruik van die invoer etiket om 'n knoppie te skep, werk vir sy doel, is dit 'n beter opsie om die -tag te gebruik om jou HTML-knoppies te skep. Die -tag is meer buigsaam, want dit laat jou toe om beelde vir die knoppie te gebruik (wat jou help om visuele konsekwentheid te behou as jou werf byvoorbeeld 'n ontwerp tema het) en dit kan gedefinieer word as 'n knoppie wat ingedien of herstel word. sonder enige ekstra JavaScript.

U sal die kenmerk van die knoppie tipe in enige tags wil spesifiseer. Daar is drie verskillende tipes:

  • knoppie - Die knoppie het geen inherente gedrag nie, maar word gebruik in kombinasie met skrifte wat op die kliënt se kant loop wat aan die knoppie geheg kan word en uitgevoer word wanneer dit geklik word.
  • reset - Herstel alle waardes.
  • stuur - Die knoppie stuur vorm data aan die bediener (dit is die verstekwaarde indien geen tipe gedefinieer is nie).

Ander eienskappe sluit in:

  • naam - Gee die knoppie 'n verwysingsnaam.
  • waarde - Spesifiseer 'n waarde wat aanvanklik aan die knoppie toegewys moet word.
  • deaktiveer - Skakel die knoppie af.

HTML5 voeg 'n paar bykomende eienskappe by die -tag wat u meer funksionaliteit gee.

  • Outofocus - Wanneer die bladsy laai, spesifiseer dit dat hierdie knoppie die fokus is. Slegs een outfokus kan op 'n bladsy gebruik word.
  • vorm - Associate die knoppie met 'n vorm binne dieselfde HTML-dokument, met die identifiseerder van die vorm as die waarde. Byvoorbeeld:
  • Formaction - Gebruik slegs met type = "Submit" en 'n URL as die waarde, dit spesifiseer waar vorm data gestuur sal word. Byvoorbeeld:
  • formenctype - Gebruik slegs met die tipe = "Submit" kenmerk. Definieer hoe vorm data geënkodeer moet word wanneer dit aan die bediener voorgelê word. Die drie waardes is toepassing / x-www-vorm-urlenkode (standaard), veelvoude / vorm-data en teks / plain.
  • Form Method - Gebruik slegs met die tipe = "Submit" kenmerk. Dit spesifiseer watter HTTP-metode om te gebruik wanneer vormdata ingedien word, of kry of plaas.
  • Formnovalidate - Gebruik slegs met die tipe = "Submit" kenmerk. Vormdata sal nie gevalideer word wanneer dit ingedien word nie.
  • Form Target - Gebruik slegs met die tipe = "Submit" kenmerk. Dit dui aan waar die antwoord op die werf moet vertoon wanneer vorm data ingedien word, soos in 'n nuwe venster, ens. Die waarde opsies is _blank, _self, _parent, _top of 'n spesifieke raam naam.

As jy vorms gebruik, sal jy dalk wil lees hoe om knoppies in HTML-vorms te maak , en hoe om jou werf meer gebruikersvriendelik te maak.