HTML5 Textarea-attribut: Här är vad du bör veta
Vad används <textarea> till?
De flesta HTML-formulär består av ett överordnat formulärelement, en handfull inmatningselement (varav minst ett av typen submit) och ett eller flera textområden. Om du behöver formulärfält för att acceptera e-postadresser, telefonnummer och annat innehåll som är lätt att definiera, använder du lämplig inmatningstyp. När du däremot behöver ett fält som kan acceptera alla kombinationer och längder av bokstäver, siffror och symboler i ren text, är <textarea>
det element du letar efter.
HTML5 Textarea-attribut
HTML5 introducerade några nya attribut som kan användas med textarea-element. Här är några av de viktigaste:
-
form
: Associerar textområdet med ett formulär. Använd formulärets ID-attribut som värde för textområdets formulärattribut. På så sätt kan du placera ett textområde var som helst på en webbsida, även utanför formulärelementet, och ändå få innehållet i textområdet inkluderat när formuläret skickas in. -
maxlength
ochminlength
: -
placeholder
: Används för att ange ett lägsta eller högsta antal tecken som får skrivas in i ett textområde. -
placeholder
: Lägg till platshållartext i textområdet som försvinner så snart användaren placerar markören inuti elementet. -
required
: Här används en platshållartext som försvinner så snart användaren placerar markören inuti elementet. -
wrap
: Anger om hårda returer ska läggas till det innehåll som skickas in i ett textområde.
required
:
Attribut i praktiken
Här är ett exempel på hur några av dessa nya attribut kan användas för att styra beteendet hos ett textområde.
<p>This text area is limited to just 10 characters</p> <textarea cols="50" rows="3" maxlength="10" placeholder="Just 10 characters allowed"></textarea> <p>This text area is readonly and cannot be changed</p> <textarea cols="50" rows="3" readonly>This value can't be changed</textarea>
If we pair those textarea elements with a simple script and button element, we get the following form: