Tekstvakken


HTML Tekstvakken

Een HTML tekstvak (textarea) is een extra grote tekstveld dat geschikt is voor het invoeren van onbeperkte hoeveelheid tekst door de gebruiker.

Een tekstvak wordt op een webpagina geplaatst met behulp van het <textarea> element.

VoorbeeldVoorbeeld:
<textarea rows="5" cols="50" name="omschrijving">
Vertel iets over jezelf...
</textarea>

De volgende attributen van het element textarea worden hieronder beschreven:

autofocus, cols, disabled, form, maxlength, name, placeholder, readonly, required rows en wrap.


HTML5Autofocus attribuuttop

Geeft aan dat een tekstvak automatisch een focus moet krijgen wanneer de pagina wordt geladen. De gebruiker kan direct beginnen met typen. Autofocus werkt alleen in browsers die het attribuut ondersteunen.

VoorbeeldVoorbeeld:
<textarea autofocus> ... </textarea>


Cols attribuuttop

Met het cols attribuut bepaal je de breedte van het tekstvak. De waarde is uitgedrukt in het aantal karakters.

VoorbeeldVoorbeeld:
<textarea cols="50"> ... </textarea>
Uitproberen CSS


Disabled attribuuttop

Met dit attribuut kan het veld niet meer bewerkt worden. Ook kan de tekst niet meer worden geselecteerd.

VoorbeeldVoorbeeld:
<textarea disabled> ... </textarea>


Form attribuuttop

Het form attribuut bevat één of meer formulieren waar de tekstvak behoort.

VoorbeeldVoorbeeld:
<textarea form="demoform"> ... </textarea>


Maxlength attribuuttop

Hiermee wordt het maximaal aantal tekens dat ingevoerd kan worden ingesteld.

VoorbeeldVoorbeeld:
<textarea maxlength="50"> ... </textarea>


Name attribuuttop

Het name attribuut kent een naam toe aan het tekstvak. Name wordt gebruikt om de inhoud van een tekstvak die naar een programma (script) op de server wordt gestuurd te identificeren.

VoorbeeldVoorbeeld:
<textarea name="voorbeeld"> ... </textarea>


HTML5Placeholder attribuuttop

Het attribuut placeholder specificeert een korte beschrijving van een tekstvak.

VoorbeeldVoorbeeld:
<textarea placeholder="Vertel iets over jezelf..."> ... </textarea>


Readonly attribuuttop

Met dit attribuut kan de gebruiker de inhoud of de status van het veld niet wijzigen.

VoorbeeldVoorbeeld:
<textarea readonly> ... </textarea>


HTML5Required attribuuttop

Het required attribuut zorgt ervoor dat een tekstvak moet worden ingevuld.

VoorbeeldVoorbeeld:
<textarea required> ... </textarea>


Rows attribuuttop

Met het attribuut rows bepaal je de hoogte van het tekstvak. De waarde is uitgedrukt in het aantal rijen.

VoorbeeldVoorbeeld:
<textarea rows="5"> ... </textarea>
Uitproberen CSS


Wrap attribuuttop

Het wrap attribuut geeft aan hoe de tekst in een tekstvak moet worden weergegeven. Je kunt met dit attribuut bepalen of de tekst in een tekstvak aan het einde van de rij wel of niet moet worden afgebroken.

De volgende waarden zijn mogelijk:

Hard: Hiermee wordt de tekst in het tekstvak afgebroken weergegeven en de tekst dat naar de server wordt verzonden begint met een nieuwe regel.
Soft: Hiermee wordt de tekst in het tekstvak afgebroken weergegeven en de tekst dat naar de server wordt verzonden wordt als één lange regel geplaatst.
Off: De tekst wordt niet afgebroken weergegeven, maar op één lange regel geplaatst.

VoorbeeldVoorbeeld:
<textarea wrap="hard"> ... </textarea>

Tip Het attribuut cols moet worden opgegeven indien je gebruik gaat maken van de waarde hard.
Soft is de standaard waarde als je geen gebruik maakt van wrap.