dexblog.ro
HTML Toate tagurile HTML

Formulare și introducere date HTML 4.0+

Element clicabil pentru declanșarea trimiterii formularelor sau a unor acțiuni JavaScript în pagină.

Sintaxă tag 
<button type="submit">Trimite</button>
<button type="button">Închide</button>

Ce face <button>

Tagul <button> definește un buton nativ clicabil. Spre deosebire de <input type="button">, tagul <button> poate conține în interiorul său orice marcaj: text, iconițe SVG, imagini sau text formatat.

Atributul type este crucial:
• submit (comportament implicit într-un formular): trimite formularul.
• button: buton generic pentru JavaScript (nu trimite formularul).
• reset: resetează câmpurile la valorile inițiale.

Atribute

Atribut Descriere
type „submit” (implicit), „button” (pentru JavaScript) sau „reset”.
disabled Dezactivează butonul și previne clicul.
name Numele trimis la server la expedierea formularului.
value Valoarea trimisă asociată numelui butonului.

Exemple

Exemplul 1: Buton cu iconiță și text

Permite combinarea oricărui element HTML în interiorul butonului.

<button type="button" onclick="alert('Salvat!')">
  <span>&#128190;</span> Salvează modificările
</button>

Ce afișează browserul

Un buton gri-argintiu cu iconița unei dischete și textul: Salvează modificările.

Greșeli frecvente

  • Omiterea atributului type=”button” pentru butoanele destinate interacțiunii JavaScript din formulare; fără el, browserul consideră butonul de tip submit și va reîncărca întreaga pagină.
  • Folosirea tagului
    cu eveniment de clic în loc de

Comenzi înrudite

  • <form>: Containerul principal pentru colectarea datelor de la utilizator și trimiterea lor către un server.
  • <input>: Cel mai versatil element de formular: își schimbă complet aspectul și funcția în funcție de atributul type.
  • <a>: Creează un hyperlink către o altă pagină web, un fișier, o adresă de email, un număr de telefon sau o ancoră din pagină.