Crearea de butoane folosind etichete de intrare HTML în formulare

Creați butoane text personalizabile în HTML folosind intrare etichetă. intrare elementul este utilizat în cadrul unui formă element.

Prin setarea atributtip la „buton”, generează un simplu buton pe care se poate face clic. Puteți defini textul care va apărea pe buton, cum ar fi „Trimiteți”, utilizând valoare atribut. De exemplu:


intrare eticheta nu va trimite un formular HTML; trebuie să includeți JavaScript pentru a gestiona trimiterea formularului de date. Fără JavaScript onclick Într-un eveniment, butonul va apărea pe care se poate face clic, dar nu se va întâmpla nimic și veți fi frustrat cititorii.

Alternativa de etichetă „buton”

Deși utilizați intrare eticheta pentru a crea un buton funcționează în scopul său, este o opțiune mai bună de a utiliza buton eticheta pentru a crea butoanele HTML ale site-ului dvs. web. buton eticheta este mai flexibilă, deoarece vă permite să utilizați imagini pentru buton (ceea ce vă ajută să păstrați consistența vizuală în cazul în care site-ul are o temă de proiectare), de exemplu, și poate fi definit ca un tip de buton de trimitere sau resetare fără a fi nevoie de niciun supliment JavaScript.

watch instagram stories

Specificați butonul tip atribut în orice buton Etichete. Există trei tipuri diferite:

  • buton: Butonul nu are un comportament inerent, dar este utilizat împreună cu scripturile care rulează pe partea client, care pot fi atașate butonului și executate atunci când se face clic pe acesta.
  • resetați: Resetează toate valorile.
  • Trimite: Butonul trimite datele formularului către server (aceasta este valoarea implicită dacă nu este definit niciun tip).

Alte atribute includ:

  • Nume: Oferă butonului un nume de referință.
  • valoare: Specifică o valoare care trebuie atribuită inițial butonului.
  • dezactivați: Oprește butonul.

Mergând mai departe cu butoane

HTML5 adaugă atribute suplimentare la buton etichetă care își extinde funcționalitatea.

  • focalizare automată: Când pagina se încarcă, această opțiune specifică faptul că acest buton este punctul central. Pe o pagină poate fi utilizat un singur focalizare automată.
  • formă: Asociază butonul cu un formular specific din același document HTML, utilizând identificatorul formularului ca valoare.
  • formarea: Folosit numai cu type = "trimiteți" și o adresă URL ca valoare, specifică unde vor fi trimise datele formularului. Adesea, destinația este un script PHP sau ceva similar,
  • formenctype: Folosit numai cu type = "trimiteți" atribut. Definește modul în care datele de formular trebuie codificate atunci când sunt trimise la server. Cele trei valori sunt application / x-www-form-urlencoded (Mod implicit), multipart / formular-date, și text / simplu.
  • metodă de formare: Folosit numai cu type = "trimiteți" atribut. Aceasta specifică fie metoda HTTP de utilizat la trimiterea datelor formularului obține sau post.
  • formnovalidate: Folosit numai cu type = "trimiteți" atribut. Datele formularului nu vor fi validate atunci când sunt trimise.
  • formtarget: Folosit numai cu type = "trimiteți" atribut. Aceasta indică unde trebuie afișat răspunsul site-ului atunci când sunt trimise datele formularului, cum ar fi într-o fereastră nouă etc. Opțiunile de valoare sunt fie_blank, _self, _parent, _top, sau un nume de cadru specific.

Citiți mai multe despre realizarea de butoane în formulare HTML, și cum să faceți site-ul dvs. mai ușor de utilizat.

instagram story viewer