HTML5 Textarea Attributes: Here’s What You Should Know
Do czego służy <textarea>?
Większość formularzy HTML składa się z nadrzędnego elementu formularza, garści elementów wejściowych (z których przynajmniej jeden będzie typu submit), oraz jednego lub więcej textareas. Jeśli potrzebujesz pól formularza do akceptowania adresów email, numerów telefonów i innej zawartości, która jest łatwa do zdefiniowania, użyj odpowiedniego typu input. Jeśli jednak potrzebujesz pola, które może zaakceptować dowolną kombinację i długość liter, cyfr i symboli, <textarea> jest elementem, którego szukasz.
Atrybuty pola tekstowego HTML5
HTML5 wprowadził kilka nowych atrybutów, które mogą być używane z elementami pola tekstowego. Oto kilka najważniejszych z nich:
-
form: Asocjuje textarea z formularzem. Użyj atrybutu ID formularza jako wartości dla atrybutów formularza textarea. Pozwala to na umieszczenie textarea w dowolnym miejscu na stronie internetowej, nawet poza elementem formularza, i nadal mieć zawartość textarea włączoną, gdy formularz jest przesłany. -
maxlengthiminlength: Używane do określenia minimalnej lub maksymalnej liczby znaków, które mogą być wprowadzone do pola tekstowego. -
placeholder: Dodaje tekst zastępczy do pola tekstowego, który znika, gdy tylko użytkownik umieści kursor wewnątrz elementu. -
required: Wymaga aby textarea zawierało treść przed zezwoleniem na wysłanie formularza. -
wrap: Określa czy hard-returns powinien być dodany do treści wysłanej w textarea.
Atrybuty w akcji
Oto przykład jak niektóre z tych nowych atrybutów mogą być użyte do kontrolowania zachowania textarea.
<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:
