Tipos de entrada HTML5

Nuevos tipos de entrada HTML5

HTML5 tiene varios tipos de entrada de formulario nuevos. Estas nuevas características proporcionan un mejor control de entrada y validación.

En este capítulo se describen estos nuevos tipos de entrada integrales:

• color
• fecha
• de fecha y hora
• fecha y hora local
• correo electrónico
• mes
• número
• intervalo
• búsqueda
• tel
• tiempo
• url
• semana

Nota: No todos los principales navegadores soportan los nuevos tipos de entrada, pero ya se puede utilizar en todos los principales navegadores.Si no se admiten, todavía puede aparecer como campos de texto normales.

Tipo de entrada: Color

color utilizado en el tipo de campo de entrada se utiliza principalmente para seleccionar el color, como sigue:

Ejemplos

Elija un color en el selector de color:

选择你喜欢的颜色: <input type="color" name="favcolor">

Trate »

Tipo de entrada: Fecha

tipo de fecha le permite seleccionar una fecha de un selector de fechas.

Ejemplos

Definir un controlador de tiempo:

生日: <input type="date" name="bday">

Trate »

Tipo de entrada: fecha y hora

Tipo de fecha y hora le permite seleccionar una fecha (hora GMT).

Ejemplos

Definir una fecha y un controlador de tiempo (hora local):

生日 (日期和时间): <input type="datetime" name="bdaytime">

Trate »

Tipo de entrada: fecha y hora local

Tipo de fecha y hora local le permite seleccionar una fecha y hora (sin zona horaria).

Ejemplos

Definir una fecha y hora (sin zona horaria):

生日 (日期和时间): <input type="datetime-local" name="bdaytime">

Trate »

Tipo de entrada: correo electrónico

Tipo de correo electrónico se utiliza para campos de entrada debe contener direcciones de correo electrónico.

Ejemplos

Cuando se envía el formulario, se verificará automáticamente si el dominio de correo electrónico válida valor:

E-mail: <input type="email" name="email">

Trate »

Consejo: iPhone en el navegador Safari es compatible con el tipo de entrada de correo electrónico, y cambiando el teclado de pantalla táctil para que coincida con ella (añada @ .com y opciones).

Tipo de entrada: el mes

Tipo de mes le permite seleccionar un mes.

Ejemplos

el mes y el año definido (sin zona horaria):

生日 (月和年): <input type="month" name="bdaymonth">

Trate »

Tipo de entrada: Número

Tipo de número se utiliza para campos de entrada debe contener un valor.

También puede configurar para aceptar un número limitado:

Ejemplos

Definir un campo de entrada numérico (limitada):

数量 ( 1 到 5 之间 ): <input type="number" name="quantity" min="1" max="5">

Trate »

Utilice la siguiente propiedad para especificar el tipo de la tecnología digital Limited:

• El máximo permitido por la normativa Max-
• min - el mínimo permitido por las regulaciones
• paso - especifica los intervalos de números legales para (si el paso = "3", números legales podría ser -3,0,3,6, etc)
• valor - el valor predeterminado especificado

Pruebe un ejemplo con todos los atributos definidos tratan

Tipo de entrada: gama

tipo de gama se usa para campos de entrada debe contener una gama de valores numéricos.

Tipo de rango se muestra como un control deslizante.

Ejemplos

No es necesario definir un valor muy preciso (como un control deslizante):

<input type="range" name="points" min="1" max="10">

Trate »

Por favor utilice los siguientes atributos para especificar el tipo de la tecnología digital Limited:

• max - el máximo permitido por la normativa
• min - el mínimo permitido por las regulaciones
• paso - especifica los intervalos de números legales para
• valor - el valor predeterminado especificado

Tipo de entrada: buscar

Tipo de búsqueda para el campo de búsqueda, tales como la búsqueda del sitio o de búsqueda de Google.

Ejemplos

Definir un campo de búsqueda (similar a la búsqueda del sitio o de búsqueda de Google):

Search Google: <input type="search" name="googlesearch">

Trate »

Tipo de entrada: tel

Ejemplos

Introduzca el teléfono está definido campo de número:

电话号码: <input type="tel" name="usrtel">

Trate »

Tipo de entrada: el tiempo

Tipo de tiempo le permite seleccionar un tiempo.

Ejemplos

Define controlador de tiempo de entrada (sin zona horaria):

选择时间: <input type="time" name="usr_time">

Trate »

Tipo de entrada: url

escribe la URL se utiliza para campos de entrada debe contener una dirección URL.

Cuando se envía el formulario, se verificará automáticamente el valor del campo URL.

Ejemplos

Definir la URL campo de entrada:

添加您的主页: <input type="url" name="homepage">

Trate »

Consejo: iPhone en el navegador Safari soporta url tipo de entrada, y cambiando el teclado de pantalla táctil para que coincida con ella (la opción de añadir .com).

Tipo de entrada: la semana

semana le permite seleccionar el tipo de la semana y el año.

Ejemplos

Definiciones semana y el año (sin zona horaria):

选择周: <input type="week" name="week_year">

Trate »

etiqueta <input> de HTML5