Opret tilpassede tekstknapper i HTML bruger input tag. Det input element bruges inden for en form element.
Ved at indstille attributtype til "knap" genererer en simpel klikbar knap. Du kan definere den tekst, der vises på knappen, såsom "Send" ved hjælp af værdi attribut. For eksempel:
Det input tag vil ikke indsende en HTML-formular; du skal medtage JavaScript til at håndtere indsendelse af formulardata. Uden JavaScript onclick begivenhed, knappen ser ud til at være klikbar, men der sker ikke noget, og du vil have frustreret dine læsere.
'Knappen' Tag alternativ
Selvom du bruger input tag for at oprette en knap fungerer til sit formål, det er en bedre mulighed for at bruge knap tag for at oprette dit websteds HTML-knapper. Det knap tag er mere fleksibelt, fordi det giver dig mulighed for at bruge billeder til knappen (hvilket hjælper dig med at bevare visuel konsistens, hvis din webstedet har et designtema), for eksempel, og det kan defineres som en indsend eller nulstil type knap uden behov for noget ekstra JavaScript.
Angiv knappen type attribut i enhver knap tags. Der er tre forskellige typer:
- knap: Knappen har ingen iboende adfærd, men bruges sammen med scripts, der kører på klientsiden, som kan knyttes til knappen og udføres, når der klikkes på den.
- Nulstil: Nulstiller alle værdier.
- Indsend: Knappen sender formulardata til serveren (dette er standardværdien, hvis ingen type er defineret).
Andre attributter inkluderer:
- navn: Giver knappen et referencenavn.
- værdi: Angiver en værdi, der oprindeligt tildeles knappen.
- deaktiver: Slår knappen fra.
Gå videre med knapper
HTML5 tilføjer yderligere attributter til knap tag, der udvider dets funktionalitet.
- autofokus: Når siden indlæses, angiver denne indstilling, at denne knap er i fokus. Kun en autofokus kan bruges på en side.
- form: Knytter knappen til en bestemt form i det samme HTML-dokument ved hjælp af formularens id som værdien.
- formaktion: Anvendes kun med type = "send" og en URL som værdi, angiver den, hvor formulardata sendes. Ofte er destinationen et PHP-script eller noget lignende,
- formtype: Anvendes kun med type = "send" attribut. Definerer, hvordan formulardata skal kodes, når de sendes til serveren. De tre værdier er application / x-www-form-urlencoded (Standard), multipart / form-data, og tekst / almindelig.
- formmetode: Anvendes kun med type = "send" attribut. Dette angiver, hvilken HTTP-metode der skal bruges, når der indsendes formulardata, enten få eller stolpe.
- formnovalidat: Anvendes kun med type = "send" attribut. Formulardata valideres ikke, når de sendes.
- formtarget: Anvendes kun med type = "send" attribut. Dette angiver, hvor siteresvaret skal vises, når formulardata indsendes, f.eks. I et nyt vindue osv. Værdiindstillingerne er enten_blank, _self, _parent, _top, eller et bestemt rammenavn.
Læs mere om lave knapper i HTML-formularerog hvordan du gør dit websted mere brugervenligt.