Pogu izveidošana, izmantojot HTML ievades tagus veidlapās

Izveidojiet pielāgojamas teksta pogas HTML izmantojot ievade tagu. The ievade elements tiek izmantots a formā elements.

Iestatot atribūtstips uz "pogu" ģenerē vienkāršu klikšķināmu pogu. Izmantojot taustiņu, varat definēt tekstu, kas tiks parādīts uz pogas, piemēram, “Iesniegt” vērtība atribūts. Piemēram:


The ievade tags neiesniegs HTML veidlapu; jums jāiekļauj JavaScript apstrādāt veidlapas datu iesniegšanu. Bez JavaScript onclick Pasākums, šķiet, būs noklikšķināms, taču nekas nenotiks, un jūs būsiet sarūgtinājis lasītājus.

“Pogas” taga alternatīva

Kaut arī izmantojot ievade , lai izveidotu pogu, darbojas atbilstoši savam mērķim, tā ir labāka iespēja izmantot pogu tagu, lai izveidotu savas vietnes HTML pogas. The pogu tags ir elastīgāks, jo ļauj pogai izmantot attēlus (kas palīdz saglabāt vizuālo konsekvenci, ja vietnei ir dizaina tēma), piemēram, un to var definēt kā pogas iesniegšanas vai atiestatīšanas veidu, bez papildu nepieciešamības JavaScript.

Norādiet pogu tips atribūts jebkurā pogu tagus. Ir trīs dažādi veidi:

instagram viewer
  • pogu: Pogai nav raksturīgas darbības, taču tā tiek izmantota kopā ar klienta pusē darbojamiem skriptiem, kurus var piestiprināt pogai un izpildīt, noklikšķinot uz tās.
  • atiestatīt: Atiestata visas vērtības.
  • Iesniegt: Poga iesniedz veidlapas datus serverim (šī ir noklusējuma vērtība, ja nav definēts neviens veids).

Citi atribūti ietver:

  • nosaukums: Piešķir pogai atsauces nosaukumu.
  • vērtība: Norāda vērtību, kas sākotnēji jāpiešķir pogai.
  • atspējot: Izslēdz pogu.

Ar pogām iet tālāk

HTML5 pievieno papildu atribūtus pogu tagu, kas paplašina tā funkcionalitāti.

  • autofokuss: Kad lapa tiek ielādēta, šī opcija norāda, ka uzmanība tiek pievērsta šai pogai. Lapā var izmantot tikai vienu autofokusu.
  • formā: Saista pogu ar noteiktu formu tajā pašā HTML dokumentā, kā vērtību izmantojot formas identifikatoru.
  • veidošana: Lieto tikai ar type = "iesniegt" un URL kā vērtību, tas norāda, kur veidlapas dati tiks nosūtīti. Bieži vien galamērķis ir PHP skripts vai kaut kas līdzīgs,
  • formenctype: Lieto tikai ar type = "iesniegt" atribūts. Nosaka, kā veidlapas dati jākodē, iesniedzot serverim. Trīs vērtības ir application / x-www-form-urlencoded (noklusējums), daudzdaļīgas / veidlapas dati, un teksts / vienkāršs.
  • formas metode: Lieto tikai ar type = "iesniegt" atribūts. Tas norāda, kuru HTTP metodi izmantot, iesniedzot veidlapas datus gūt vai pastu.
  • formnovalidāts: Lieto tikai ar type = "iesniegt" atribūts. Veidlapas dati netiks apstiprināti, kad tiks iesniegti.
  • formtarget: Lieto tikai ar type = "iesniegt" atribūts. Tas norāda, kur vietnes atbilde jāparāda, iesniedzot veidlapas datus, piemēram, jaunā logā utt. Vērtības opcijas ir vai nu_ blank, _self, _parent, _top, vai konkrēta rāmja nosaukums.

Lasiet vairāk par pogu veidošana HTML formās, un kā padarīt vietni draudzīgāku lietotājam.