Atributos del Textarea HTML5: Esto es lo que debes saber
¿Para qué se utiliza el <textarea>?
La mayoría de los formularios HTML se componen de un elemento de formulario padre, un puñado de elementos de entrada (al menos uno de los cuales será del tipo submit), y uno o más textareas. Si necesita que los campos de formulario acepten direcciones de correo electrónico, números de teléfono y otros contenidos fáciles de definir, utilice el tipo de entrada apropiado. Sin embargo, cuando necesite un campo que pueda aceptar cualquier combinación y longitud de letras, números y símbolos de texto plano, <textarea> es el elemento que está buscando.
Atributos de textarea de HTML5
HTML5 introdujo unos cuantos atributos nuevos que se pueden utilizar con los elementos de textarea. Estos son algunos de los más importantes:
-
form: Asocia el textarea con un formulario. Utiliza el atributo ID del formulario como valor para los atributos del textarea. Esto le permite colocar un textarea en cualquier lugar de una página web, incluso fuera del elemento formulario, y seguir teniendo el contenido del textarea incluido cuando se envía el formulario. -
maxlengthyminlength: Se utilizan para especificar un número mínimo o máximo de caracteres que se pueden introducir en un área de texto. -
placeholder: Añade texto de marcador de posición al textarea que desaparece en cuanto el usuario coloca el cursor dentro del elemento. -
required: Requiere que el textarea contenga contenido antes de permitir el envío del formulario. -
wrap: Especifica si se deben añadir o no retornos duros al contenido enviado en un textarea.
Atributos en acción
Aquí tienes un ejemplo de cómo se pueden utilizar algunos de estos nuevos atributos para controlar el comportamiento de un 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:
