: el elemento Input (Form Input)

accept

Válido solo para el tipo de entrada file, el atributo accept define qué tipos de archivos se pueden seleccionar en un control de carga file. Consulte el tipo de entrada de archivo.

alt

Válido solo para el botón image, el proporciona texto alternativo para la imagen, mostrando el valor del atributo si la imagen src falta o no se carga. Consulte el tipo de entrada de la imagen.

autocomplete

(¡No es un atributo booleano!) El atributo autocomplete toma como valor una cadena separada por espacios que describe qué tipo de funcionalidad de autocompletar, si corresponde, debe proporcionar la entrada. Una implementación típica de autocompletar recuerda los valores anteriores ingresados en el mismo campo de entrada, pero pueden existir formas más complejas de autocompletar. Por ejemplo, un navegador podría integrarse con la lista de contactos de un dispositivo para autocompletar email direcciones en un campo de entrada de correo electrónico. Consulte Valores en el atributo de autocompletar HTML para conocer los valores permitidos.

El atributo autocomplete es válido en hidden, text, search, url, tel, email, date, month, week, time, datetime-local, number, range, color y password. Este atributo no tiene ningún efecto en los tipos de entrada que no devuelven datos numéricos o de texto, siendo válido para todos los tipos de entrada excepto checkbox, radio, file, o cualquiera de los tipos de botones.

Consulte El atributo de autocompletar HTML f o información adicional, incluida información sobre la seguridad de la contraseña y cómo autocomplete es ligeramente diferente para hidden que para otros tipos de entrada.

autofocus

Un atributo booleano que, si está presente, indica que la entrada debe tener el foco automáticamente cuando la página haya terminado de cargarse (o cuando el <dialog> que contiene el elemento).

Nota: Un elemento con el atributo autofocus puede ganar foco antes que DOMContentLoaded se activa el evento.

No más de un elemento en el documento puede tener el atributo autofocus. Si se coloca en más de un elemento, el primero con el atributo recibe el foco.

El atributo autofocus no se puede usar en entradas de tipo hidden, ya que las entradas ocultas no se pueden enfocar.

Advertencia: enfocar automáticamente un control de formulario puede confundir a las personas con discapacidad visual que utilizan tecnología de lectura de pantalla y a las personas con deficiencias cognitivas. Cuando se asigna autofocus, los lectores de pantalla «teletransportan» a su usuario al control de formulario sin advertirles de antemano.

Tenga en cuenta la accesibilidad cuando aplicando el atributo autofocus. Centrarse automáticamente en un control puede hacer que la página se desplace durante la carga. El enfoque también puede hacer que se muestren teclados dinámicos en algunos dispositivos táctiles. Mientras que un lector de pantalla anunciará la etiqueta del control de formulario que recibe el foco, el lector de pantalla no anunciará nada antes de la etiqueta y el usuario vidente en un dispositivo pequeño igualmente perderá el contexto creado por el contenido anterior.

capture

Introducido en la especificación HTML Media Capture y válido solo para el file tipo de entrada, el capture define qué medio (micrófono, video o cámara) se debe usar para capturar un nuevo archivo para cargarlo con file control de carga en escenarios compatibles. Consulte el tipo de entrada de archivo.

checked

Válido tanto para radio y checkbox tipos, checked es un atributo booleano. Si está presente en un tipo radio, indica que el botón de opción es el seleccionado actualmente en el grupo de botones de opción del mismo nombre. Si está presente en un tipo checkbox, indica que la casilla de verificación está marcada de forma predeterminada (cuando se carga la página). No indica si esta casilla de verificación está actualmente marcada: si se cambia el estado de la casilla de verificación, este atributo de contenido no refleja el cambio. (Solo se actualiza el atributo IDL de HTMLInputElement checked.)

Nota: A diferencia de otros controles de entrada, los valores de las casillas de verificación y los botones de opción solo se incluyen en los datos enviados si actualmente son checked. Si es así, se envían el nombre y los valores de los controles marcados.

Por ejemplo, si una casilla de verificación cuyo name es fruit tiene un value de cherry, y la casilla de verificación está marcada, los datos del formulario enviados incluirán fruit=cherry. Si la casilla de verificación no está activa, no aparece en los datos del formulario en absoluto. El value predeterminado para las casillas de verificación y los botones de opción es on.

dirname

Válido solo para los tipos de entrada text y search, el dirname El atributo habilita la presentación de la direccionalidad del elemento. Cuando se incluye, el control de formulario se enviará con dos pares de nombre / valor: el primero es name y value, el segundo es el valor del dirname como el nombre con el valor de ltr o rtl establecido por el navegador.

Cuando se envía el formulario anterior, la entrada causa tanto el name / value par de fruit=cherry y el par dirname / direction de fruit.dir=ltr que se enviarán.

disabled

Un atributo booleano que, si está presente, indica que el usuario no debería poder interactuar con la entrada. Las entradas deshabilitadas generalmente se representan con un color más tenue o con alguna otra forma de indicación de que el campo no está disponible para su uso.

Específicamente, las entradas deshabilitadas no reciben el click y las entradas deshabilitadas no se envían con el formulario.

Nota: Aunque no es requerido por la especificación, Firefox persistirá por defecto en el estado deshabilitado dinámico de un <input> en las cargas de página. Utilice el atributo autocomplete para controlar esta función.

form

Una cadena que especifica el <form> elemento con el que está asociada la entrada (es decir, su propietario del formulario). El valor de esta cadena, si está presente, debe coincidir con el id de un elemento <form> en el mismo documento. Si este atributo no es «t especificado, el elemento <input> se asocia con el formulario contenedor más cercano, si lo hubiera.

El atributo form le permite colocar una entrada en cualquier lugar del documento, pero incluirla con un formulario en otra parte del documento.

Nota: Una entrada solo puede asociarse con un formulario.

formaction

Válido solo para los tipos de entrada image y submit. Consulte el tipo de entrada de envío para obtener más información.

formenctype

Válido para image y submit tipos de entrada solamente. Consulte el tipo de entrada de envío para obtener más información.

formmethod

Válido para image y submit tipos de entrada solamente. Consulte el tipo de entrada de envío para obtener más información.

formnovalidate

Válido para image y submit tipos de entrada solamente. Consulte el tipo de entrada de envío para obtener más información.

formtarget

Válido para image y submit tipos de entrada solamente. Para obtener más información, consulte el tipo de entrada de envío.

height

Válido solo para el botón de entrada image, el height es la altura del archivo de imagen que se mostrará para representar el botón de envío gráfico. Vea el tipo de entrada de la imagen.

id

Atributo global válido para todos los elementos, incluidos todos los tipos de entrada, define un identificador único (ID) que debe ser único en todo el documento. Su propósito es identificar el elemento al enlazar. El valor se utiliza como el valor del atributo <label> «s for para vincular la etiqueta con el control de formulario. Consulte <label>.

inputmode

Valor global válido para todos los elementos, proporciona una pista a los navegadores sobre el tipo de configuración del teclado virtual utilizar al editar este elemento o su contenido. Los valores incluyen none, text, tel, url, email, numeric, decimal y search.

list

El valor dado al atributo list debe ser el id de un elemento <datalist> ubicado en el mismo documento. <datalist> proporciona una lista de valores predefinidos para sugerir al usuario para esta entrada. Cualquier valor de la lista que no sea compatible con type no se incluye en las opciones sugeridas. Los valores proporcionados son sugerencias, no requisitos: los usuarios pueden seleccionar de esta lista predefinida o proporcionar un valor diferente.

Es válido en text, search, url, tel, email, date, month, week, time, datetime-local, number, range y color.

Según las especificaciones, el atributo list no es compatible con hidden, password, checkbox, radio, file o cualquier de los tipos de botones.

Dependiendo del navegador, el usuario puede ver una paleta de colores personalizada sugerida, marcas de tic en un rango o incluso una entrada que se abre como un <select> pero permite va no listado lues. Consulte la tabla de compatibilidad del navegador para conocer los otros tipos de entrada.

Consulte el elemento <datalist>.

max

Válido para date, month, week, time, datetime-local, number y range, define el mayor valor en el rango de valores permitidos. Si el value ingresado en el elemento excede esto, el elemento falla en la validación de restricción. Si el valor del atributo max no es «un número, entonces el elemento no tiene un valor máximo.

Hay un caso especial: si el tipo de datos es periódico (como para fechas u horas), el valor de max puede ser más bajo que el valor de min, lo que indica que el rango puede envolver; por ejemplo, esto le permite especificar un rango de tiempo de 10 p.m. a 4 a.m.

maxlength

Válido para text, search, url, tel, email y password, define el número máximo de caracteres (como unidades de código UTF-16) que el usuario puede ingresar en el campo. Debe ser un valor entero. 0 o superior. Si no se especifica maxlength o se especifica un valor no válido, el campo no tiene una longitud máxima. Este valor también debe ser mayor o igual que el valor de .

La entrada fallará la validación de restricción si la longitud del texto ingresado en el campo es mayor que maxlength Unidades de código UTF-16 de largo. De forma predeterminada, los navegadores evitan que los usuarios ingresen más caracteres de los permitidos por el atributo maxlength. Consulte Validación del lado del cliente para obtener más información.

min

Válido para date, month, week, time, datetime-local, number y range, define el valor más negativo en el rango de valores permitidos. Si el value ingresado en el elemento es menor que esto, el elemento falla en la validación de restricción. Si el valor del atributo min no es «un número, entonces el elemento no tiene un valor mínimo.

Este valor debe ser menor o igual que el valor de el atributo max. Si el atributo min está presente pero no está especificado o no es válido, no hay min. Si el atributo min es válido y un valor no vacío es menor que el mínimo permitido por min atributo, la validación de restricciones evitará el envío de formularios. Consulte Validación del lado del cliente para obtener más información.

Hay un caso especial: si el tipo de datos es periódico (como para fechas u horas), el valor de max puede ser menor que el valor de min, lo que indica que el rango puede ajustarse; por ejemplo, esto le permite especificar un tiempo rango de 10 p.m. a 4 a.m.

minlength

Válido para text, search, url, tel, email y password, define el número mínimo de caracteres (como unidades de código UTF-16) que el usuario puede ingresar en el campo de entrada. Debe ser un valor entero no negativo menor o igual que el valor especificado por maxlength. Si no se especifica minlength, o se especifica un valor no válido, la entrada no tiene una longitud mínima.

La entrada fallará la validación de restricción si la longitud del texto ingresado en el campo tiene menos de minlength unidades de código UTF-16, lo que impide el envío de formularios. Consulte Validación del lado del cliente para obtener más información.

multiple

El atributo booleano multiple, si se establece, significa el usuario puede ingresar direcciones de correo electrónico separadas por comas en el widget de correo electrónico o puede elegir más de un archivo con la entrada file. Vea el correo electrónico y el tipo de entrada de archivo.

name

Una cadena que especifica un nombre para el control de entrada. Este nombre se envía junto con el valor del control cuando se envían los datos del formulario.

Qué hay en un nombre

Considere la name un atributo obligatorio (aunque «no lo es»). Si una entrada no tiene name especificado o name está vacío, el ¡El valor de la entrada no se envía con el formulario! (Los controles deshabilitados, los botones de radio sin marcar, las casillas de verificación sin marcar y los botones de reinicio tampoco se envían).

Hay dos casos especiales:

  1. _charset_: si se usa como el nombre de un <input> elemento de tipo oculto, la entrada «s value se establece automáticamente por el agente de usuario a la codificación de caracteres que se utiliza para enviar el formulario.
  2. isindex: por razones históricas, el nombre isindex no está permitido.
nombre y botones de opción

El atributo name crea un comportamiento único para los botones de opción.

Solo se puede marcar un botón de opción en un grupo de botones de opción con el mismo nombre a la vez. Al seleccionar cualquier botón de opción en ese grupo, se anula automáticamente la selección de cualquier botón de opción actualmente seleccionado en el mismo grupo. El valor de que se envíe un botón de opción marcado junto con el nombre si se envía el formulario,

Cuando se tabula en una serie de grupo de botones de radio con nombre, si uno está marcado, ese recibirá el foco. Si no están agrupados en orden de origen, si uno del grupo está marcado, la tabulación en el grupo comienza cuando se encuentra el primero del grupo, omitiendo todos los que no están marcados. En otras palabras, si se marca una, la tabulación omite los botones de opción no marcados del grupo. Si no se marca ninguno, el grupo de botones de opción recibe el foco cuando se alcanza el primer botón en el mismo grupo de nombre.

Una vez que uno de los botones de opción en un grupo tiene el foco, con las teclas de flecha navegará por los botones de opción con el mismo nombre, incluso si los botones de opción no están agrupados en el orden de origen.

HTMLFormElement.elements

Cuando un elemento de entrada recibe un name, ese nombre se convierte en una propiedad de la propiedad HTMLFormElement.elements del elemento del formulario propietario. Si tiene una entrada cuya name se establece en guest y otro cuyo name es hat-size, el siguiente código se puede utilizar:

Cuando este código se haya ejecutado, guestName será el HTMLInputElement para el campo guest y hatSize el objeto para hat-size campo.

Advertencia: Evite dar a los elementos del formulario un name que corresponda a una propiedad incorporada del formulario, ya que entonces anularía la propiedad o método predefinido con esta referencia a la entrada correspondiente.

pattern

El atributo pattern, cuando se especifica, es una expresión regular que el input «s value debe coincidir para que el valor pase la validación de restricción. Debe ser una expresión regular JavaScript válida, tal como la usa el tipo RegExp, y como se documenta en nuestra guía sobre expresiones regulares; el indicador "u" se especifica al compilar la expresión regular, de modo que el patrón se trata como una secuencia de puntos de código Unicode, en lugar de como ASCII. No se deben especificar barras diagonales alrededor del texto del patrón.

Si el atributo pattern está presente pero no está especificado o no es válido, no se aplica ninguna expresión regular y esto El atributo se ignora por completo.Si el atributo del patrón es válido y un valor no vacío no coincide con el patrón, la validación de la restricción evitará el envío del formulario.

Sugerencia: si usa el pattern, informe al usuario sobre el formato esperado incluyendo un texto explicativo cercano. También puede incluir un atributo title para explicar cuáles son los requisitos para coincidir con el patrón; la mayoría de los navegadores mostrarán este título como información sobre herramientas. La explicación visible es necesaria para la accesibilidad. La información sobre herramientas es una mejora.

Consulte Validación del lado del cliente para obtener más información.

placeholder

El El atributo placeholder es una cadena que proporciona una breve pista al usuario sobre el tipo de información que se espera en el campo. Debe ser una palabra o frase corta que proporcione una pista sobre el tipo de datos esperado, en lugar de una explicación o aviso. El texto no debe incluir retornos de carro ni saltos de línea. Por ejemplo, si se espera que un campo capture el nombre de un usuario y su etiqueta es «Nombre», un marcador de posición adecuado podría ser «p. Ej. Mustafa «.

Nota: El atributo placeholder no es tan útil semánticamente como otras formas de explicar su formulario y puede causar problemas técnicos inesperados con su contenido. Consulte Etiquetas en < input >: el elemento Input (Form Input) para obtener más información.

readonly

Un atributo booleano que, si está presente, indica que el usuario no debería poder editar el valor de la entrada. El readonly es compatible text, search, url, tel, email, date, month, week, time, datetime-local, number y password tipos de entrada.

Consulte el atributo HTML: readonly para obtener más información.

required es un atributo booleano que, si está presente, indica que el usuario debe especificar un valor para la entrada antes de que se pueda enviar el formulario propietario. El atributo required es compatible con text, search, url, tel, email, date, month, week, time, datetime-local, number, password, checkbox, radio y file entradas.

Consulte Validación del lado del cliente y el atributo HTML: required para obtener más información.

sizeVálido paraemail,password,telytextinputsolo tipos. Especifica la cantidad de entrada que se muestra. Básicamente crea el mismo resultado que establecer la propiedad CSSwidthcon algunas especialidades. La unidad real del valor depende del tipo de entrada. Parapasswordytext, es un número de caracteres (oemunidades) con un valor predeterminado de20, y para otros, espixels. El ancho de CSS tiene prioridad sobre el atributo de tamaño.src

Válido solo para el image botón de entrada, el src es una cadena que especifica la URL del archivo de imagen que se mostrará para representar el botón de envío gráfico. Consulte el tipo de entrada de la imagen.

step

Válido para los tipos de entrada numérica, incluido number, fecha / time tipos de entrada, y range, el atributo step es un número que especifica la granularidad que debe cumplir el valor.

Si no se incluye explícitamente:

  • step tiene el valor predeterminado 1 para number y range.
  • Para los tipos de entrada de fecha / hora, step se expresa en segundos, con el paso predeterminado de 60 segundos . El factor de escala de pasos es 1000 (que convierte los segundos en milisegundos, como se usa en otros algoritmos).

El valor debe ser un número positivo (entero o flotante) o el valor especial any, lo que significa que no se implica ningún paso y se permite cualquier valor (salvo otras restricciones, como min y max).

Si any no está establecido explícitamente, valores válidos para number, tipos de entrada de fecha / hora y range los tipos de entrada son iguales a la base para el paso: el valor min y los incrementos del valor del paso, hasta el max valor, si se especifica.

Por ejemplo, si tiene <input type="number" min="10" step="2">, cualquier entero par, 10 o superior, es válido. Si se omite, <input type="number">, cualquier número entero es válido, pero los flotantes (como 4.2) no son válidos, porque step por defecto es 1. Para que 4.2 sea válido, step debería haberse configurado en any, 0,1 , 0.2, o cualquier valor min tendría que ser un número terminado en .2, como <input type="number" min="-5.2">

Nota: Cuando los datos ingresados por el usuario no se adhieren a la configuración escalonada, el valor se considera inválido en la validación de restricciones y coincidirá con el :invalid pseudoclase.

Consulte Validación del lado del cliente para obtener más información.

tabindex

Atributo global válido para todos los elementos, incluidos todos los tipos de entrada, un atributo entero que indica si el elemento puede tomar el foco de entrada (es enfocable), si debe participar en la navegación secuencial del teclado. Como todos los tipos de entrada excepto la entrada de tipo oculto son enfocables, este atributo no debe usarse en controles de formulario, ya que hacerlo requeriría la administración del enfoque Ordenamos todos los elementos dentro del documento con el riesgo de dañar la usabilidad y la accesibilidad si se hace incorrectamente.

title

Atributo global válido para todos los elementos, incluidos todos los tipos de entrada , que contiene un texto que representa información de aviso relacionada con el elemento al que pertenece. Normalmente, pero no necesariamente, dicha información puede presentarse al usuario como información sobre herramientas. El título NO debe usarse como la explicación principal del propósito del control de formulario. En su lugar, use el elemento <label> con un atributo for establecido en el control de formulario «s id atributo. Consulte las etiquetas a continuación.

type

Una cadena que especifica el tipo de control que se va a representar. Por ejemplo, para crear una casilla de verificación, un valor de checkbox se usa. Si se omite (o se especifica un valor desconocido), se usa el tipo de entrada text, creando un campo de entrada de texto sin formato.

Los valores permitidos se enumeran en <input> tipos anteriores.

value

El valor del control de entrada. Cuando se especifica en el HTML, este es el valor inicial y, a partir de ese momento, se puede modificar o recuperar en cualquier momento utilizando JavaScript para acceder al objeto HTMLInputElement correspondiente «s value. El atributo value es siempre opcional, aunque debe considerarse obligatorio para checkbox, radio y hidden.

width

Válido para image solo botón de entrada, width es el ancho del archivo de imagen que se mostrará para representar el botón de envío gráfico. Consulte el tipo de entrada de imagen.

Leave a Reply

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *