EL IDIOMA UNIVERSAL INTERACTIVO
Cómo crear cuadros de texto

 

 

Los cuadros de texto son los ingredientes básicos para crear un formulario. Cómo el resto de los objetos usados para recibir datos, se crean con la etiqueta <INPUT>, seguida de estos atributos que indican su tipo y su forma.

TYPE: Define qué clase de objeto se creará en el formulario. En el caso de una caja de texto, debe recibir el valor "Text".

NAME: Identifica al objeto. Para hacerlo conviene usar un nombre que refiera al tipo de información que recibirá, por ejemplo: "Nombre" o "País", para que pueda leerse sin problemas al recibirla.

 

Comparte tus dudas y consejos con otros usuarios de Javascript

TEMAS RELACIONADOS

Curso completo de HTML

Un lugar para tu sitio personal

Indice del curso de JavaScript

 

SIZE: Otorga la medida (en pixels) de la caja del texto. Si no se define, el browser presenta el cuadro en tamaño 20.

VALUE: En el caso de un objeto "Text", el value muestra un mensaje en el cuadro, que el usuario borrará para ingresar los datos pedidos.

Usando todos estos atributos, un cuadro de texto se crea así:

<FORM NAME="MiForm" METHOD ....>

<INPUT TYPE="text" NAME="nombre" VALUE="¿Cómo te llamas?" SIZE=30>

</FORM>

Y el resultado es:

Cada elemento del formulario y sus atributos son entendidos por JavaScript como objetos y propiedades, respectivamente. Así, puedes crear scripts con funciones relacionadas a uno o varios objetos del formulario. Prueba este ejemplo:

Ingresa tu nombre y presiona ENTER

El script reconoce el contenido del cuadro de texto y lo muestra en forma de saludo en un cuadro tipo "Alert". Fíjate en el código de la imagen para saber cómo hacerlo.

clic para ampliar

Lo primero es crear el formulario (llamado "formulario1") con el cuadro de texto (cajatexto). Luego, se define una función con una variable (mensaje) que guarda el contenido (value) del objeto "text". Y se concatena (+) esa variable a la palabra "Hola" que mostrará el cuadro Alert.

La función se activa desde el evento "onClick", asignado al botón "Respuesta".

Para aprender a crear botones y usarlos junto a los cuadros de texto, sigue leyendo.