attributi tipo di input HTML

HTML <input> tag

Supporto per il browser

Tutti i browser principali supportano l'attributo type. Tuttavia, non tutti i principali browser supportano tutti i diversi tipi di ingresso possono lavorare in tutti i principali browser.

Vedi sotto per ogni tipo di ingresso di supporto del browser.

Definizione e utilizzo

<Input> attributo type specifica il tipo di elemento che si desidera visualizzare.

Il tipo predefinito è: testo.

Nota: non è richiesto Questo attributo, ma pensiamo che si dovrebbe sempre usare.

Le differenze tra HTML 4.01 e HTML5

I seguenti tipi di ingresso sono nuovi in ​​HTML5 tipo: il colore, la data, datetime, datetime locale, mese, settimana, tempo, e-mail, numero, gamma, di ricerca, tel e URL.

grammatica

Proprietà Valore

Esempi

Tipo di ingresso: pulsante

Esempi

Definizione di pulsanti cliccabili, quando l'utente fa clic su un pulsante per avviare un periodo di JavaScript:

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

Prova »

Tipo di ingresso: casella di controllo

Esempi

Box consente all'utente di selezionare una o più opzioni in una serie di scelte:

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

Prova »

Tipo di ingresso: colore

Esempi

Scegliere un colore dal selettore colore:

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

Prova »

Tipo di ingresso: Data

Esempi

Controlli data:

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

Prova »

Tipo di ingresso: datetime

Esempi

Definire i controlli di data e ora (con fuso orario):

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

Prova »

Tipo di ingresso: datetime-locale

Esempi

Definire i controlli di data e ora (senza fuso orario):

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

Prova »

Tipo di ingresso: e-mail

Esempi

Le definizioni dei campi per l'indirizzo e-mail (quando il modulo viene inviato automaticamente al valore del campo e-mail per verificare):

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

Prova »

Suggerimento: il browser Safari iPhonericonoscerà il tipo di ingresso e-mail, quindi modificare la tastiera touch screen di adattarsi ad esso (aggiungere @ e .com opzioni).

Tipo di ingresso: File

Esempi

Per definire campo di selezione del file e un pulsante "Sfoglia ...", per il caricamento di file:

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

Prova »

Tipo di ingresso: nascosto

Esempi

Definizione di campi nascosti, campi nascosti non sono visibili per l'utente. campi nascosti spesso memorizzano un valore predefinito, o cambiare i loro valori dal JavaScript:

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

Prova »

Tipo di ingresso: Immagine

Esempi

immagine personalizzata come il pulsante di invio:

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

Prova »

Tipo di ingresso: mese

Esempi

Definire il controllo del mese e dell'anno (senza fuso orario):

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

Prova »

Tipo di ingresso: numero

Esempi

Inserire un numero per definire i campi per (è possibile impostare il numero limite accettabili):

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

Prova »

Si prega di utilizzare i seguenti attributi per specificare restrizioni:

• MAX - il massimo consentito dalla normativa.
• min - al minimo consentito dalle normative.
• STEP - requisiti per l'intervallo digitale legale.
• Il valore - predefinito specificato.

Tipo di ingresso: la password

Esempi

Definire i campi password (campi password sono personaggi mascherati):

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

Prova »

Tipo di ingresso: Radio

Esempi

Esso consente all'utente di selezionare un'opzione in un certo numero di scelte:

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

Prova »

Tipo di ingresso: gamma

Esempi

Definisce il valore esatto non è importante il controllo digitale di ingresso (come dispositivi di scorrimento). È inoltre possibile impostare i limiti accettabili i numeri:

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

Prova »

Si prega di utilizzare i seguenti attributi per specificare restrizioni:

• MAX - il massimo consentito dalla normativa.
• min - al minimo consentito dalle normative.
• STEP - requisiti per l'intervallo digitale legale.
• Il valore - predefinito specificato.

Tipo di ingresso: reset

Esempi

Definire il pulsante di ripristino (reset tutto la forma è l'impostazione predefinita):

<input type="reset">

Prova »

Suggerimento: Fare attenzione utilizzando il tasto di reset!Per gli utenti, cliccato accidentalmente sul pulsante Reset è una cosa molto fastidiosa.

Tipo di ingresso: ricerca

Esempi

Definito campo di ricerca (ad esempio, siti di ricerca o di ricerca di Google, etc.):

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

Prova »

Tipo di ingresso: presentare

Esempi

Definire il pulsante di invio:

<input type="submit">

Prova »

Tipo di ingresso: tel

Esempi

campi definiti per l'inserimento di numeri di telefono:

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

Prova »

Tipo di ingresso: il testo

Esempi

L'utente può definire due per entrare in una sola riga di testo in un campo di testo:

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

Prova »

Tipo di ingresso: il tempo

Esempi

Inserire l'ora della definizione di controllo viene utilizzata (senza fuso orario):

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

Prova »

Tipo di ingresso: URL

Esempi

Definisce i campi di input del URL:

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

Prova »

Suggerimento: il browser Safari iPhonericonoscerà il tipo di ingresso URL, quindi modificare la tastiera touch screen di adattarsi ad esso (opzione .com aggiungere).

Tipo di ingresso: settimana

Esempi

Definizione di settimana e di controllo anno (senza fuso orario):

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

Prova »