HTML5 Textarea Attributes: Heres What You Should Know ” HTML5 Textarea Attributes: Itt van, amit tudnod kell
Mire szolgál <textarea>?
A legtöbb HTML űrlap egy szülő űrlapelemből, egy maroknyi beviteli elemből (amelyek közül legalább egy submit típusú) és egy vagy több textarea-ból áll. Ha az űrlapmezőkbe e-mail címeket, telefonszámokat és más, könnyen definiálható tartalmakat kell felvenni, használja a megfelelő beviteli típust. Ha azonban olyan mezőre van szüksége, amely a sima szöveges betűk, számok és szimbólumok bármilyen kombinációját és hosszát képes elfogadni, akkor a <textarea> a keresett elem.
HTML5 Textarea attribútumok
A HTML5 bevezetett néhány új attribútumot, amelyek a textarea elemekkel használhatók. Íme néhány a legfontosabbak közül:
-
form: A textarea-t egy űrlaphoz társítja. Használja az űrlap ID attribútumát a textarea űrlap attribútumainak értékeként. Ez lehetővé teszi, hogy egy textarea-t bárhol elhelyezzen a weboldalon, akár az űrlap elemen kívül is, és az űrlap elküldésekor a textarea tartalma mégis megjelenjen. -
maxlengthésminlength: A szövegmezőbe beírható karakterek minimális vagy maximális számának megadására szolgál. -
placeholder: Helyőrző szöveget ad a szövegmezőhöz, amely eltűnik, amint a felhasználó a kurzort az elem belsejébe helyezi. -
required: Megköveteli, hogy a textarea tartalmazzon tartalmat, mielőtt engedélyezné az űrlap elküldését. -
wrap: Meghatározza, hogy a textarea-ban elküldött tartalomhoz adjon-e kemény visszatérést.
Attribútumok működésben
Íme egy példa arra, hogyan használható néhány ilyen új attribútum a textarea viselkedésének szabályozására.
<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:
