<input type="email">

Gli elementi <input> di tipo email consentono all'utente di inserire e modificare un indirizzo e-mail o, se l'attributo multiple è specificato, un elenco di indirizzi e-mail.

Il valore di input viene convalidato automaticamente per garantire che sia vuoto o un indirizzo e-mail (o un elenco di indirizzi) formattato correttamente prima che il modulo possa essere inviato. Le pseudo-classi CSS :valid e :invalid vengono applicate automaticamente in modo appropriato per denotare visivamente se il valore corrente del campo è un indirizzo e-mail valido o meno.

Nei browser che non supportano input di tipo email, un input email torna ad essere un input di testo standard .

Valore

L' attributo value dell'elemento <input> contiene una stringa che viene automaticamente convalidata come conforme alla sintassi dell'e-mail. Più nello specifico, ci sono tre possibili formati di valore che passeranno la convalida:

1. Una stringa vuota ("") che indica che l'utente non ha immesso un valore o che il valore è stato rimosso.
2. Un unico indirizzo e-mail correttamente formato. Questo non significa necessariamente che l'indirizzo e-mail esista, ma almeno è formattato correttamente. In parole povere, questo significa username@domain o [email protected].
3. Se e solo se l'attributo multiple è specificato, il valore può essere un elenco di indirizzi e-mail separati da virgole correttamente formati. Eventuali spazi vuoti finali e iniziali vengono rimossi da ciascun indirizzo nell'elenco.

Attributi aggiuntivi

Oltre agli attributi che operano su tutti gli elementi <input> indipendentemente dal loro tipo, gli input email supportano i seguenti attributi.

list

I valori dell'attributo list sono quelli di un elemento <datalist> che si trova nello stesso documento. <datalist> fornisce un elenco di valori predefiniti da suggerire all'utente per questo input. Eventuali valori nell'elenco che non sono compatibili con type non sono inclusi nelle opzioni suggerite. I valori forniti sono suggerimenti, non requisiti: gli utenti possono selezionare da questo elenco predefinito o fornire un valore diverso.

maxlength

Il numero massimo di caratteri (come unità di codice UTF-16) che l'utente può inserire nell'input email. Deve essere un valore intero 0 o superiore. Se non viene specificato maxlength o viene specificato un valore non valido, l'input email non ha una lunghezza massima. Questo valore deve anche essere maggiore o uguale al valore di minlength.

L'input fallirà la convalida del vincolo se la lunghezza del valore di testo del campo è maggiore delle hunità di codice UTF-16 in maxlength. La convalida del vincolo viene applicata solo quando il valore viene modificato dall'utente.

minlength

Il numero minimo di caratteri (come unità di codice UTF-16) che l'utente può inserire nell'input email. Deve essere un valore intero non negativo minore o uguale al valore specificato da maxlength. Se viene specificato no minlengtho viene specificato un valore non valido, l' input email non ha una lunghezza minima.

L'input fallirà la convalida del vincolo se la lunghezza del valore di testo del campo è maggiore delle hunità di codice UTF-16 in minlength. La convalida del vincolo viene applicata solo quando il valore viene modificato dall'utente.

multiple

Un attributo booleano che, se presente, indica che l'utente può inserire un elenco di più indirizzi e-mail, separati da virgole e, facoltativamente, da spazi bianchi.

pattern

L'attributo pattern, quando specificato, è un'espressione regolare a cui il value di input deve corrispondere affinché il valore superi la convalida del vincolo. Deve essere un'espressione regolare JavaScript valida, come utilizzata dal tipo RegExp e come documentato nella nostra guida sulle espressioni regolari; il flag 'u' viene specificato durante la compilazione dell'espressione regolare, in modo che il modello venga trattato come una sequenza di punti di codice Unicode, anziché come ASCII. Nessuna barra in avanti deve essere specificata attorno al testo del modello.

Se il modello specificato non è specificato o non è valido, non viene applicata alcuna espressione regolare e questo attributo viene completamente ignorato.

placeholder

L'attributo placeholder è una stringa che fornisce un breve suggerimento all'utente sul tipo di informazioni previste nel campo. Dovrebbe essere una parola o una breve frase che dimostri il tipo di dati previsto, piuttosto che un messaggio esplicativo. Il testo non deve includere ritorni a capo o avanzamenti di riga.

readonly

Un attributo booleano che, se presente, significa che questo campo non può essere modificato dall'utente. Tuttavia value, può ancora essere modificato dal codice JavaScript impostando direttamente la proprietà HTMLInputElement value.

size

L'attributo size è un valore numerico che indica quanti caratteri deve essere largo il campo di input. Il valore deve essere un numero maggiore di zero e il valore predefinito è 20. Poiché le larghezze dei caratteri variano, questo può essere esatto o meno e non dovrebbe essere considerato tale; l'input risultante potrebbe essere più stretto o più largo del numero di caratteri specificato, a seconda dei caratteri e del font.

Questo non pone un limite al numero di caratteri che l'utente può inserire nel campo. Specifica solo approssimativamente quanti possono essere visti alla volta. Per impostare un limite superiore alla lunghezza dei dati di input, utilizzare l'attributo maxlength.