El value Atributo
El value atributo especifica el valor inicial para un campo de entrada:
Ejemplo
<form action="">
First name:<br>
<input type="text" name="firstname" value="John">
<br>
Last name:<br>
<input type="text" name="lastname">
</form> Inténtalo tú mismo " El readonly Atributo
El readonly atributo especifica que el campo de entrada es de sólo lectura (cannot be changed) :
Ejemplo
<form action="">
First name:<br>
<input type="text" name="firstname" value="John" readonly>
<br>
Last name:<br>
<input type="text" name="lastname">
</form> Inténtalo tú mismo " El readonly atributo no tiene un valor. Es lo mismo que escribir sólo lectura = "sólo lectura".
El disabled Atributo
El disabled atributo especifica que el campo de entrada se desactiva.
Un elemento con discapacidad es un-un-utilizable y hacer clic.
No se presentaron elementos deshabilitados.
Ejemplo
<form action="">
First name:<br>
<input type="text" name="firstname" value="John" disabled>
<br>
Last name:<br>
<input type="text" name="lastname">
</form> Inténtalo tú mismo " El disabled atributo no tiene un valor. Es lo mismo que escribir discapacitados = "desactivado".
El size Atributo
El size atributo especifica el tamaño (in characters) para el campo de entrada:
Ejemplo
<form action="">
First name:<br>
<input type="text" name="firstname" value="John" size="40">
<br>
Last name:<br>
<input type="text" name="lastname">
</form> Inténtalo tú mismo " El maxlength Atributo
El maxlength atributo especifica la longitud máxima permitida para el campo de entrada:
Ejemplo
<form action="">
First name:<br>
<input type="text" name="firstname" maxlength="10">
<br>
Last name:<br>
<input type="text" name="lastname">
</form> Inténtalo tú mismo " Con un maxlength atributo, el control de entrada no aceptará más que el número de caracteres permitidos.
El atributo no proporciona ninguna retroalimentación. Si desea alertar al usuario, debe escribir código JavaScript.
restricciones de entrada no son infalibles. JavaScript ofrece muchas maneras de agregar la entrada ilegal.
Para restringir la entrada de seguridad, las restricciones deben ser revisados por el receptor (the server) también.
Los atributos de HTML5
HTML5 añade los following atributos de <input> :
- autocomplete
- autofocus
- form
- formaction
- formenctype
- formmethod
- formnovalidate
- formtarget
- height and width
- list
- min and max
- multiple
- pattern (regexp)
- placeholder
- required
- step
y los following atributos de <form> :
- autocomplete
- novalidate
El autocomplete Atributo
El autocomplete atributo especifica si un campo de formulario o de entrada debe tener autocomplete encendido o apagado.
Cuando autocomplete está activado, el navegador automáticamente los valores completos basados en valores que el usuario ha introducido antes.
Tip: Es posible tener autocomplete "on" para el formulario, y "off" para los campos de entrada específicos, o viceversa.
El autocomplete atributo trabaja con <form> y la siguiente <input> tipos: text, search, url, tel, email, password, datepickers, range, and color .
Ejemplo
Un formulario HTML con autocomplete en (and off for one input field) :
<form action="action_page.php" autocomplete="on">
First name:<input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
E-mail: <input type="email" name="email" autocomplete="off"><br>
<input type="submit">
</form> Inténtalo tú mismo " Consejo: En algunos navegadores puede que tenga que activar la autocomplete función para que esto funcione.
El novalidate Atributo
El novalidate atributo es un <form> atributo.
Cuando está presente, novalidate especifica que los datos del formulario no deben ser validados cuando se presente.
Ejemplo
Indica que la forma no debe ser validada en enviar:
<form action="action_page.php" novalidate>
E-mail: <input type="email" name="user_email">
<input type="submit">
</form> Inténtalo tú mismo " El autofocus Atributo
El autofocus atributo es un atributo booleano.
Cuando está presente, especifica que un <input> elemento debe recibir automáticamente el enfoque cuando se carga la página.
Ejemplo
Deje que el "First name" campo de entrada obtener automáticamente el enfoque cuando se carga la página:
First name:<input type="text" name="fname" autofocus> Inténtalo tú mismo " La form Attribute
La form atributo especifica una o más formas de un <input> elemento pertenece.
Tip: Para referirse a más de una forma, usar una lista separada por espacios de form ids .
Ejemplo
Un input field situado fuera de la forma HTML (but still a part of the form) :
<form action="action_page.php" id="form1">
First name: <input type="text" name="fname"><br>
<input type="submit" value="Submit">
</form>
Last name: <input type="text" name="lname" form="form1"> Inténtalo tú mismo " El formaction Atributo
El formaction atributo especifica la dirección URL de un archivo que va a procesar el control de entrada cuando se envía el formulario.
El formaction atributo anula la action atributo de la <form> elemento.
El formaction atributo se utiliza con type = "submit" y tipo = "imagen".
Ejemplo
Un formulario HTML con dos botones de envío, con diferentes acciones:
<form action="action_page.php">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit"><br>
<input type="submit" formaction="demo_admin.asp"
value="Submit as admin">
</form> Inténtalo tú mismo " El formenctype Atributo
El formenctype atributo especifica cómo los datos del formulario-deben ser codificados al presentar al servidor (only for forms with method="post" ) .
El formenctype atributo anula el enctype atributo de la <form> elemento.
El formenctype atributo se utiliza con type="submit" y type="image" .
Ejemplo
Enviar form-data que está codificado por defecto (the first submit button) , y codificado como "multipart/form-data" (the second submit button) :
<form action="demo_post_enctype.asp" method="post">
First name: <input type="text" name="fname"><br>
<input type="submit" value="Submit">
<input type="submit" formenctype="multipart/form-data"
value="Submit as Multipart/form-data">
</form> Inténtalo tú mismo " El formmethod Atributo
El formmethod atributo define el método HTTP para enviar form-data a la URL de acción.
El formmethod atributo anula el method atributo de la <form> elemento.
El formmethod atributo puede utilizarse con type="submit" y type="image" .
Ejemplo
El segundo botón de enviar reemplaza el método HTTP de la forma:
<form action="action_page.php" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
<input type="submit" formmethod="post" formaction="demo_post.asp"
value="Submit using POST">
</form> Inténtalo tú mismo " El formnovalidate Atributo
El novalidate atributo es un atributo booleano.
Cuando está presente, se especifica que el <input> elemento no debe ser validada cuando se presente.
El formnovalidate atributo anula el novalidate atributo de la <form> elemento.
El formnovalidate atributo puede utilizarse con type="submit" .
Ejemplo
Un formulario con dos botones de envío (with and without validation) :
<form action="action_page.php">
E-mail: <input type="email" name="userid"><br>
<input type="submit" value="Submit"><br>
<input type="submit" formnovalidate value="Submit without validation">
</form> Inténtalo tú mismo " El formtarget Atributo
El formtarget atributo especifica un nombre o una palabra clave que indica dónde mostrar la respuesta que se recibe después de enviar el formulario.
El formtarget atributo anula el target atributo de la <form> elemento.
El formtarget atributo puede utilizarse con type = "submit" y type = "imagen".
Ejemplo
Un formulario con dos botones de envío, con diferentes ventanas de destino:
<form action="action_page.php">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit as normal">
<input type="submit" formtarget="_blank"
value="Submit to a new window">
</form> Inténtalo tú mismo " Los height y width Atributos
Los height atributos y anchura especifican la altura y la anchura de un <input> elemento.
Los height y width atributos sólo se utilizan con <input type="image"> .
Siempre especificar el tamaño de las imágenes. Si el navegador no sabe el tamaño, la página parpadeará mientras que las imágenes se cargan.
Ejemplo
Definir una imagen como el botón de enviar, con los atributos de altura y anchura:
<input type="image" src="img_submit.gif" alt="Submit" width="48" height="48"> Inténtalo tú mismo " La list atributos
La list atributo se refiere a un <datalist> elemento que contiene opciones predefinidas para un <input> elemento.
Ejemplo
Un <input> elemento con los valores predefinidos en un <datalist> :
<input list="browsers">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist> Inténtalo tú mismo " Los min y max Atributos
El min y max atributos especifican el valor mínimo y máximo para un <input> elemento.
El min y max los atributos de trabajo con los siguientes tipos de entrada: number, range, date, datetime, datetime-local, month, time and week .
Ejemplo
<Input> elementos con valores mínimo y máximo:
Enter a date before 1980-01-01:
<input type="date" name="bday" max="1979-12-31">
Enter a date after 2000-01-01:
<input type="date" name="bday" min="2000-01-02">
Quantity (between 1 and 5):
<input type="number" name="quantity" min="1" max="5"> Inténtalo tú mismo " El multiple Attribute
El multiple atributo es un atributo booleano.
Cuando está presente, especifica que el usuario está autorizado para entrar en más de un valor en el <input> elemento.
El multiple atributo trabaja con los siguientes tipos de entrada: email y file .
Ejemplo
Un campo para subir archivos que acepta varios valores:
Select images: <input type="file" name="img" multiple> Inténtalo tú mismo " El pattern Atributo
El pattern atributo especifica una expresión regular que la <input> valor de elemento se comprueba contra.
El pattern atributo trabaja con los siguientes tipos de entrada: text, search, url, tel, email, and password .
Consejo: Utilice el mundial título de atributos para describir el patrón para ayudar al usuario.
Tip: Más información sobre expresiones regulares en nuestro tutorial JavaScript.
Ejemplo
Un campo de entrada que puede contener sólo tres letras (no numbers or special characters) :
Country code: <input type="text" name="country_code" pattern="[A-Za-z]{3}" title="Three letter country code"> Inténtalo tú mismo " El placeholder Atributo
El placeholder atributo especifica una pista que describe el valor esperado de un campo de entrada (a sample value or a short description of the format) .
La pista se muestra en el campo de entrada antes de que el usuario introduce un valor.
El placeholder atributo trabaja con los siguientes tipos de entrada: text, search, url, tel, email, and password .
Ejemplo
Un campo de entrada con un marcador de posición de texto:
<input type="text" name="fname" placeholder="First name"> Inténtalo tú mismo " La required Atributo
El required atributo es un atributo booleano.
Cuando está presente, se especifica que un campo de entrada debe ser llenada antes de enviar el formulario.
La required atributo trabaja con los siguientes tipos de entrada: text, search, url, tel, email, password, date pickers, number, checkbox, radio, and file .
Ejemplo
Un campo de entrada requerido:
Username: <input type="text" name="usrname" required> Inténtalo tú mismo " El step Attribute
El step atributo especifica los intervalos de número legal para un <input> elemento.
Ejemplo: Si el paso = "3", números legales podrían ser -3, 0, 3, 6, etc.
Tip: El step atributo puede ser utilizado junto con el max y el min atributos para crear una gama de valores legales.
El step atributo trabaja con los siguientes tipos de entrada: number, range, date, datetime, datetime-local, month, time and week .
Ejemplo
Un campo de entrada con unos intervalos de números legales especificados:
<input type="number" name="points" step="3"> Inténtalo tú mismo "