New(ish) in HTML5

elautocomplete atributo se introdujo como una característica HTML no oficial en Internet Explorer de Microsoft, y fue adoptado por un número de otros navegadores. Por lo tanto, ha habido un amplio apoyo para él durante mucho tiempo, aunque su comportamiento exacto no estaba estandarizado. Con HTML5, el atributo autocomplete es una parte oficial de la especificación.,

Autocompletar vs. list&< datalist>

el atributo autocomplete pide al navegador que intente en el historial de usuario. Esto es útil para detalles personales como el nombre y la dirección de correo electrónico, cosas que el usuario probablemente tenga en campos de entrada similares en otros sitios web. La función autocomplete no puede proporcionar al navegador una lista de opciones de autocompletar específicas del sitio., Para el comportamiento de autocompletar con sugerencias específicas del sitio, utilice el atributo list con el elemento <datalist>.

deliberadamente «roto»

todos los principales navegadores ignoran el valor autocomplete="off" para ciertos tipos de campos de entrada. Internet Explorer y Edge lo ignoran para todos los campos password. Firefox lo ignora para cualquier campo en un formulario de inicio de sesión. Chrome lo ignora cada vez que el Usuario ha elegido dejar que el navegador recuerde los datos del formulario. Safari lo ignora para los campos de nombre de usuario, correo electrónico y contraseña., Ignorar el valor autocomplete="off" se hace para mejorar la usabilidad y darle al usuario más control sobre el comportamiento de autocompletar. Como diseñador de UX, debe seguir su ejemplo y usar autocomplete="off" con moderación. Hay muy pocos casos de uso en formularios normales donde realmente tiene sentido rechazar autocomplete. En algunas aplicaciones complejas, tiene sentido evitar entradas accidentales, pero con la mayoría de los formularios estándar realmente no hay razón para ello.,

Autocompletar y name

los navegadores utilizan el atributo name para averiguar qué tipo de información está pidiendo un campo de entrada. Por lo tanto, utilice valores estándar y significativos para name., Si usted está solicitando una dirección, el uso de nombres como:

  • address-1
  • address-2
  • city
  • state o province
  • zip o postal-code

no uso inteligente o extrañamente nombres específicos, como la que hace más difícil para el navegador para proporcionar sugerencias de autocompletar, y puede incluso conducir a que el navegador tratando de llenar en los valores incorrectos en malas entradas., (¿ Alguna vez ha tenido su navegador llenar su número de teléfono en el campo de código postal? Eso fue culpa del mal nombre.)

valores del atributo Autocompletar

valor Name Notes
off desactiva la Autocompletar.
on activa el autocompletado.,

Todos los Atributos de Elemento de entrada

nombre del Atributo Valores Notas
paso Especifica el intervalo entre los valores válidos en un número basado en la entrada.
requiere Especifica que el campo de entrada es necesario; no permite el envío de formularios y avisa al usuario si el campo está vacío.
marcador de posición especifica el texto del marcador de posición en una entrada basada en texto.,
patrón Especifica una expresión regular con la que validar el valor de la entrada.
multiple permite al usuario introducir múltiples valores en una carga de archivo o entrada de correo electrónico.
min Especifica un valor mínimo para el número y fecha de los campos de entrada.
max Especifica un valor máximo para el número y fecha de los campos de entrada.,
lista Especifica el id de un elemento <datalist> elemento que ofrece una lista de sugerencias de autocompletar para el campo de entrada.
altura Especifica la altura de una imagen de entrada.
formtarget Especifica el contexto de navegación en el que se abre la respuesta desde el servidor, después del envío del formulario. Para su uso solo en los tipos de entrada de «enviar» o «imagen».,
formmethod Especifica el método HTTP (GET o POST), para ser utilizado cuando los datos del formulario se envían al servidor. Solo para usar en tipos de entrada de «enviar» o «imagen».
formenctype Especifica la forma cómo deben presentarse los datos al servidor. Solo para usar en los tipos de entrada «submit»e » image».
formaction Especifica la dirección URL para el envío de formularios. Solo se puede usar para type = «submit»Y type=»image».
formulario Especifica un formulario para que el campo de entrada pertenece.,
autofocus especifica que el campo de entrada debe estar enfocado inmediatamente después de cargar la página.
accesskey Define un método abreviado de teclado para el elemento.
Autocompletar off
on
especifica si el navegador debe intentar completar automáticamente la entrada en función de las entradas del Usuario a campos similares.
de la frontera Se utiliza para especificar un borde en una entrada. Obsoleto. Usa CSS en su lugar.,
marcado especifica si una casilla de verificación o un botón de opción de entrada de formulario deben estar marcados de forma predeterminada.
discapacidad Desactiva el campo de entrada.
maxlength Especifica el número máximo de caracteres que se puede introducir en un texto del tipo de entrada.
language se utilizó para indicar el lenguaje de scripting utilizado para los eventos activados por la entrada.
nombre Especifica el nombre de un elemento de entrada., El nombre y el valor de cada elemento de entrada se incluyen en la solicitud HTTP cuando se envía el formulario.
size especifica el ancho de la entrada en caracteres.
src Define la dirección URL de origen de una imagen de entrada.
tipo button
checkbox
file
hidden
image
password
radio
reset
submit
text
Define el tipo de entrada.
value define un valor inicial o una selección predeterminada para un campo de entrada.,
Adam is a technical writer who specializes in developer documentation and tutorials.