Il value attributo
Il value attributo specifica il valore iniziale di un campo di introduzione:
Esempio
<form action="">
First name:<br>
<input type="text" name="firstname" value="John">
<br>
Last name:<br>
<input type="text" name="lastname">
</form> Prova tu stesso " La readonly attributo
La readonly attributo specifica che il campo di input è di sola lettura (cannot be changed) :
Esempio
<form action="">
First name:<br>
<input type="text" name="firstname" value="John" readonly>
<br>
Last name:<br>
<input type="text" name="lastname">
</form> Prova tu stesso " La readonly attributo non ha bisogno di un valore. E 'lo stesso che scrivere readonly = "sola lettura".
Il disabled attributo
Il disabled attributo specifica che il campo di input è disabilitato.
Un elemento disabile è inutilizzabile e non-cliccabile.
non saranno presentate elementi portatori di handicap.
Esempio
<form action="">
First name:<br>
<input type="text" name="firstname" value="John" disabled>
<br>
Last name:<br>
<input type="text" name="lastname">
</form> Prova tu stesso " Il disabled attributo non ha bisogno di un valore. E 'lo stesso che scrivere disabled = "disabilitato".
La size attributo
La size attributo specifica la dimensione (in characters) per il campo:
Esempio
<form action="">
First name:<br>
<input type="text" name="firstname" value="John" size="40">
<br>
Last name:<br>
<input type="text" name="lastname">
</form> Prova tu stesso " Il maxlength attributo
Il maxlength attributo specifica la lunghezza massima consentita per il campo:
Esempio
<form action="">
First name:<br>
<input type="text" name="firstname" maxlength="10">
<br>
Last name:<br>
<input type="text" name="lastname">
</form> Prova tu stesso " Con un maxlength attributo, il controllo di input non accetterà più del numero consentito di caratteri.
L'attributo non fornisce feedback. Se si vuole avvertire l'utente, è necessario scrivere codice JavaScript.
restrizioni di ingresso non sono infallibili. JavaScript fornisce molti modi per aggiungere di ingresso illegale.
Per limitare in modo sicuro in ingresso, le restrizioni devono essere controllati dal ricevitore (the server) pure.
Attributi HTML5
HTML5 ha aggiunto le following attributi per <input> :
- autocomplete
- autofocus
- form
- formaction
- formenctype
- formmethod
- formnovalidate
- formtarget
- height and width
- list
- min and max
- multiple
- pattern (regexp)
- placeholder
- required
- step
ed i following attributi per <form> :
- autocomplete
- novalidate
Il autocomplete attributo
Il autocomplete attributo specifica se un campo modulo o input deve avere autocomplete o disattivare.
Quando autocomplete è attiva, il navigatore valori automaticamente completo basato sui valori che l'utente ha inserito prima.
Tip: E 'possibile avere autocomplete "on" per la forma, e "off" per campi di input specifici, o viceversa.
Il autocomplete attributo funziona con <form> e il seguente <input> tipi: text, search, url, tel, email, password, datepickers, range, and color .
Esempio
Un modulo HTML con autocomplete sulla (and off for one input field) :
<form action="action_page.php" autocomplete="on">
First name:<input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
E-mail: <input type="email" name="email" autocomplete="off"><br>
<input type="submit">
</form> Prova tu stesso " Suggerimento: In alcuni browser potrebbe essere necessario attivare il autocomplete funzione per far funzionare tutto questo.
Il novalidate attributo
Il novalidate attributo è un <form> attributo.
Quando presenti, novalidate specifica che i dati dei moduli non devono essere convalidati, se presentate.
Esempio
Indica che la forma non deve essere convalidato su conferma:
<form action="action_page.php" novalidate>
E-mail: <input type="email" name="user_email">
<input type="submit">
</form> Prova tu stesso " La autofocus attributo
La autofocus attributo è un attributo booleano.
Quando è presente, specifica che un <input> elemento dovrebbe ottenere automaticamente messa a fuoco quando la pagina viene caricata.
Esempio
Lasciate che il "First name" campo di input ottenere automaticamente messa a fuoco quando viene caricata la pagina:
First name:<input type="text" name="fname" autofocus> Prova tu stesso " Il form attributo
Il form attributo specifica una o più forme di <input> elemento appartiene.
Tip: Per fare riferimento a più di una forma, utilizzare un elenco separato da spazi di form ids .
Esempio
Un input field situato all'esterno del modulo HTML (but still a part of the form) :
<form action="action_page.php" id="form1">
First name: <input type="text" name="fname"><br>
<input type="submit" value="Submit">
</form>
Last name: <input type="text" name="lname" form="form1"> Prova tu stesso " Il formaction attributo
Il formaction attributo specifica l'URL di un file che elaborerà controllo di input quando il modulo viene inviato.
Il formaction attributo ignora l' action attributo del <form> elemento.
Il formaction attributo viene utilizzato con il tipo = "inviare" e digitare = "immagine".
Esempio
Un modulo HTML con due bottoni di invio, con diverse azioni:
<form action="action_page.php">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit"><br>
<input type="submit" formaction="demo_admin.asp"
value="Submit as admin">
</form> Prova tu stesso " Il formenctype attributo
Il formenctype attributo specifica come i form-dati devono essere codificati quando sottoporlo al server (only for forms with method="post" ) .
Il formenctype attributo ignora enctype attributo del <form> elemento.
Il formenctype attributo viene utilizzato con type="submit" e type="image" .
Esempio
Invia form-data che è codificato di default (the first submit button) , e codificati come "multipart/form-data" (the second submit button) :
<form action="demo_post_enctype.asp" method="post">
First name: <input type="text" name="fname"><br>
<input type="submit" value="Submit">
<input type="submit" formenctype="multipart/form-data"
value="Submit as Multipart/form-data">
</form> Prova tu stesso " Il formmethod attributo
Il formmethod attributo definisce il metodo HTTP per l'invio form-data all'URL azione.
Il formmethod attributo ignora il method attributo del <form> elemento.
Il formmethod attributo può essere utilizzato con type="submit" e type="image" .
Esempio
Il secondo pulsante di presentare l'override del metodo HTTP della forma:
<form action="action_page.php" method="get">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit">
<input type="submit" formmethod="post" formaction="demo_post.asp"
value="Submit using POST">
</form> Prova tu stesso " Il formnovalidate attributo
Il novalidate attributo è un attributo booleano.
Quando è presente, specifica che il <input> elemento non dovrebbe essere convalidato quando è sottoposta.
Il formnovalidate attributo ignora il novalidate attributo del <form> elemento.
Il formnovalidate attributo può essere utilizzato con type="submit" .
Esempio
Un modulo con due bottoni presentare (with and without validation) :
<form action="action_page.php">
E-mail: <input type="email" name="userid"><br>
<input type="submit" value="Submit"><br>
<input type="submit" formnovalidate value="Submit without validation">
</form> Prova tu stesso " Il formtarget attributo
Il formtarget attributo specifica un nome o una parola chiave che indica dove per visualizzare la risposta che viene ricevuto dopo l'invio del modulo.
Il formtarget attributo ignora il target attributo del <form> elemento.
Il formtarget attributo può essere utilizzato con il tipo = "invia" e digitare = "immagine".
Esempio
Un modulo con due bottoni di invio, con diverse finestre di destinazione:
<form action="action_page.php">
First name: <input type="text" name="fname"><br>
Last name: <input type="text" name="lname"><br>
<input type="submit" value="Submit as normal">
<input type="submit" formtarget="_blank"
value="Submit to a new window">
</form> Prova tu stesso " Le height e width Attributi
Le height attributi e larghezza specificano l'altezza e la larghezza di un <input> elemento.
Le height e width attributi vengono utilizzati solo con <input type="image"> .
Specificare sempre la dimensione delle immagini. Se il browser non conosce la dimensione, la pagina lampeggia mentre le immagini caricate.
Esempio
Definire un'immagine come il pulsante di invio, con gli attributi altezza e larghezza:
<input type="image" src="img_submit.gif" alt="Submit" width="48" height="48"> Prova tu stesso " La list attributo
L' list attributo si riferisce ad un <datalist> elemento contenente opzioni predefinite per un <input> elemento.
Esempio
Un <input> elemento con valori predefiniti in un <datalist> :
<input list="browsers">
<datalist id="browsers">
<option value="Internet Explorer">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist> Prova tu stesso " I min e max Attributi
Il min e max attributi specificare il valore minimo e massimo per un <input> elemento.
Il min e max attributi lavoro con i seguenti tipi di ingresso: number, range, date, datetime, datetime-local, month, time and week .
Esempio
<Input> elementi con valori minimi e massimi:
Enter a date before 1980-01-01:
<input type="date" name="bday" max="1979-12-31">
Enter a date after 2000-01-01:
<input type="date" name="bday" min="2000-01-02">
Quantity (between 1 and 5):
<input type="number" name="quantity" min="1" max="5"> Prova tu stesso " L' multiple Attribute
Il multiple attributo è un attributo booleano.
Quando presente, specifica che l'utente può immettere più di un valore nel <input> elemento.
Il multiple attributo funziona con i seguenti tipi di ingresso: email e file .
Esempio
Un campo di upload di file che accetta più valori:
Select images: <input type="file" name="img" multiple> Prova tu stesso " Il pattern attributo
Il pattern attributo specifica un'espressione regolare che il <input> valore dell'elemento viene confrontato.
Il pattern attributo funziona con i seguenti tipi di ingresso: text, search, url, tel, email, and password .
Suggerimento: utilizzare il mondiale titolo attributo per descrivere il modello per aiutare l'utente.
Tip: Scopri di più su espressioni regolari nel nostro tutorial JavaScript.
Esempio
Un campo di input che può contenere solo tre lettere (no numbers or special characters) :
Country code: <input type="text" name="country_code" pattern="[A-Za-z]{3}" title="Three letter country code"> Prova tu stesso " Il placeholder attributo
Il placeholder attributo specifica un suggerimento che descrive il valore atteso di un campo di input (a sample value or a short description of the format) .
Il suggerimento viene visualizzato nel campo di immissione prima che l'utente inserisce un valore.
Il placeholder attributo funziona con i seguenti tipi di ingresso: text, search, url, tel, email, and password .
Esempio
Un campo di input con un testo segnaposto:
<input type="text" name="fname" placeholder="First name"> Prova tu stesso " La required attributo
La required attributo è un attributo booleano.
Quando presente, specifica che un campo di ingresso deve essere compilato prima di inviare il modulo.
La required attributo funziona con i seguenti tipi di ingresso: text, search, url, tel, email, password, date pickers, number, checkbox, radio, and file .
Esempio
Un campo di introduzione:
Username: <input type="text" name="usrname" required> Prova tu stesso " Il step Abilità
Il step attributo specifica gli intervalli numerici legali per un <input> elemento.
Esempio: se passo = "3", numeri legali potrebbero essere -3, 0, 3, 6, etc.
Tip: Il step attributo può essere utilizzato insieme al max e min attributi per creare una gamma di valori di legge.
Il step attributo funziona con i seguenti tipi di ingresso: number, range, date, datetime, datetime-local, month, time and week .
Esempio
Un campo di input con intervalli numerici legali specificati:
<input type="number" name="points" step="3"> Prova tu stesso "