atributos de tipo de entrada HTML

tag HTML <input>

Suporte a navegadores

Todos os principais navegadores suportam o atributo tipo. No entanto, nem todos os principais navegadores suportam todos os diferentes tipos de entrada pode trabalhar em todos os principais navegadores.

Veja abaixo para cada tipo de entrada do suporte ao navegador.

Definição e Uso

<Input> atributo type especifica o tipo de elemento que você deseja exibir.

O tipo padrão é: texto.

Nota: Este atributo não é necessário, mas achamos que você deve sempre usá-lo.

Diferenças entre HTML 4.01 e HTML5

Os seguintes tipos de entrada são novos no tipo HTML5: cor, data, data e hora, data e hora-local, mês, semana, hora, e-mail, número, gama, pesquisa, tel e url.

gramática

Valor de propriedade

Exemplos

Tipo de entrada: botão

Exemplos

Definição de botões clicáveis, quando o usuário clica em um botão para iniciar um período de JavaScript:

<input type="button" value="点我" onclick="msg()">

tente »

Tipo de entrada: checkbox

Exemplos

Box permite que o usuário selecione uma ou mais opções em uma série de opções:

<input type="checkbox" name="vehicle[]" value="Bike"> 我有一辆自行车<br>
<input type="checkbox" name="vehicle[]" value="Car"> 我有一辆小轿车<br>
<input type="checkbox" name="vehicle[]" value="Boat"> 我有一艘船<br>

tente »

Tipo de entrada: Cor

Exemplos

Escolha uma cor no seletor de cores:

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

tente »

Tipo de entrada: Data

Exemplos

controles de data definidos:

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

tente »

Tipo de entrada: datetime

Exemplos

Definir os controles de data e hora (com fuso horário):

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

tente »

Tipo de entrada: datetime-local

Exemplos

Definir os controles de data e hora (sem fuso horário):

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

tente »

Tipo de entrada: e-mail

Exemplos

Definições de campo para o endereço de e-mail (quando o formulário é enviado automaticamente para o valor do campo email para verificar):

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

tente »

Dica: navegador iPhoneSafari irá reconhecer o tipo de entrada de e-mail, em seguida, mudar o teclado da tela sensível ao toque para se adaptar a ele (adicionar @ .com e opções).

Tipo de entrada: arquivo

Exemplos

Para definir o campo de seleção de arquivo e um botão "Browse ...", para o upload de arquivos:

选择一个文件: <input type="file" name="img">

tente »

Tipo de entrada: escondido

Exemplos

Definição de campos ocultos, campos ocultos não são visíveis para o usuário. Campos ocultos muitas vezes armazenar um valor padrão, ou alterar seus valores pela JavaScript:

<input type="hidden" name="country" value="Norway">

tente »

Tipo de entrada: Imagem

Exemplos

imagem personalizada como o botão de envio:

<input type="image" src="img_submit.gif" alt="Submit">

tente »

Tipo de entrada: mês

Exemplos

Definir o mês eo ano controle (sem fuso horário):

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

tente »

Tipo de entrada: número

Exemplos

Insira um número para definir os campos de (você pode definir os números limite aceitáveis):

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

tente »

Por favor, use os seguintes atributos para especificar restrições:

• MAX - o máximo permitido pelos regulamentos.
• min - o mínimo permitido pelos regulamentos.
• PASSO - requisitos para intervalo digitais legal.
• valorizar A - padrão especificado.

Tipo de entrada: password

Exemplos

Definir campos de senha (campos de senha são personagens mascarados):

<input type="password" name="pwd">

tente »

Tipo de entrada: Rádio

Exemplos

Ele permite que o usuário selecione uma opção em uma série de opções:

<input type="radio" name="gender" value="male"> Male<br>
<input type="radio" name="gender" value="女"> 女

tente »

Tipo de entrada: Intervalo

Exemplos

Ele define o valor exato não é importante o controle de entrada digital (tais como controles deslizantes). Você também pode definir limites de números aceitáveis:

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

tente »

Por favor, use os seguintes atributos para especificar restrições:

• MAX - o máximo permitido pelos regulamentos.
• min - o mínimo permitido pelos regulamentos.
• PASSO - requisitos para intervalo digitais legal.
• valorizar A - padrão especificado.

Tipo de entrada: redefinir

Exemplos

Definir o botão reset (reiniciar todo o formulário é o padrão):

<input type="reset">

tente »

Dica: Tenha cuidado ao usar o botão de reset!Para os usuários, acidentalmente clicou no botão Reset é uma coisa muito irritante.

Tipo de entrada: procure

Exemplos

campo de pesquisa definido (por exemplo, site de busca ou pesquisa do Google, etc.):

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

tente »

Tipo de entrada: submit

Exemplos

Defina o botão de envio:

<input type="submit">

tente »

Tipo de entrada: tel

Exemplos

campos definidos para inserir números de telefone:

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

tente »

Tipo de entrada: texto

Exemplos

O usuário pode definir dois para entrar em uma única linha de texto em um campo de texto:

First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>

tente »

Tipo de entrada: tempo

Exemplos

Introduza a hora da definição de controle é usado (sem zona horária):

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

tente »

Tipo de entrada: url

Exemplos

Define campos de entrada da URL:

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

tente »

Dica: navegador iPhoneSafari irá reconhecer o tipo de entrada url, em seguida, mudar o teclado da tela sensível ao toque para se adaptar a ele (opção .com adicionar).

Tipo de entrada: semana

Exemplos

Definição de semana e controlo ano (sem zona horária):

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

tente »