Esempio
Un modulo HTML con un campo di input che può contenere solo tre lettere (numeri o caratteri speciali):
<form action="demo_form.asp">
Country code: <input type="text" name="country_code"
pattern="[A-Za-z]{3}"
title="Three letter country code">
<input type="submit">
</form>
Prova tu stesso " Più "Provate voi stessi" esempi di seguito.
Definizione e utilizzo
Il pattern attributo specifica un'espressione regolare che il <input> il valore di elemento viene confrontato.
Nota: Il pattern attributo funziona con i seguenti tipi di ingresso: text, date, search, url, tel, email e password .
Suggerimento: utilizzare il globale title attributo per descrivere il modello per aiutare l'utente.
Tip: Per saperne di più su espressioni regolari nel nostro tutorial JavaScript.
Supporto per il browser
I numeri nella tabella indicano la prima versione del browser che supporta pienamente l'attributo.
| Attributo | |||||
|---|---|---|---|---|---|
| pattern | 5.0 | 10.0 | 4.0 | Non supportato | 9.6 |
Differenze tra HTML 4.01 e HTML5
Il pattern attributo è di nuovo in HTML5.
Sintassi
<input pattern="regexp">
I valori degli attributi
| Valore | Descrizione |
|---|---|
| regexp | Specifica un'espressione regolare che il <input> il valore di elemento viene confrontato |
Altri esempi
Esempio
Un <input> elemento con type="password" che deve contenere 6 o più caratteri:
<form action="demo_form.asp">
Password: <input type="password" name="pw" pattern=".{6,}" title="Six or
more characters">
<input type="submit">
</form>
Prova tu stesso " Esempio
Un <input> elemento con type="password" che deve contenere 8 o più caratteri che sono di almeno un numero e una maiuscola e minuscola:
<form action="demo_form.asp">
Password: <input
type="password" name="pw" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Must contain
at least one number and one uppercase and lowercase letter, and at least 8
or more characters">
<input type="submit">
</form>
Prova tu stesso " Esempio
Un <input> elemento con type="email" che deve essere nel seguente ordine: caratteri @ caratteri. dominio (caratteri seguiti da un segno @, seguiti da più caratteri, e poi un "."
Dopo il "." firmare, è possibile scrivere solo 2 o 3 lettere dalla A alla Z:
<form action="demo_form.asp">
E-mail: <input type="email"
name="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$">
<input type="submit">
</form>
Prova tu stesso " Esempio
Un <input> elemento con type="search" che non possono contenere i seguenti caratteri: ' o "
<form action="demo_form.asp">
Search: <input
type="search" name="search" pattern="[^'\x22]+" title="Invalid input">
<input type="submit">
</form>
Prova tu stesso " Esempio
Un <input> elemento con type="url" che deve iniziare con http:// o https:// seguito da almeno un carattere:
<form action="demo_form.asp">
Homepage:
<input type="url" name="website" pattern="https?://.+" title="Include
http://">
<input type="submit">
</form>
Prova tu stesso "