Atributo de padrão HTML
Definição e uso
O pattern
atributo especifica uma expressão regular com a qual o
<input>
valor do elemento é verificado.
Nota: O pattern
atributo funciona com os seguintes tipos de entrada: texto, data, pesquisa, url, tel, email e senha.
Dica: Use o atributo global title
para descrever o padrão para ajudar o usuário.
Dica: saiba mais sobre expressões regulares em nosso tutorial de JavaScript.
Aplica-se a
O pattern
atributo pode ser usado no seguinte elemento:
Elemento | Atributo |
---|---|
<entrada> | padronizar |
Exemplos
Exemplo de entrada
Um formulário HTML com um campo de entrada que pode conter apenas três letras (sem números ou caracteres especiais):
<form action="/action_page.php">
Country code: <input type="text" name="country_code"
pattern="[A-Za-z]{3}" title="Three letter country code">
<input type="submit">
</form>
Exemplo de senha
Um elemento <input> com type="password" que deve conter 6 ou mais caracteres:
<form action="/action_page.php">
Password: <input type="password" name="pw" pattern=".{6,}" title="Six or more characters">
<input type="submit">
</form>
Exemplo de senha
Um elemento <input> com type="password" que deve conter 8 ou mais caracteres de pelo menos um número e uma letra maiúscula e uma minúscula:
<form action="/action_page.php">
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>
Suporte ao navegador
Os números na tabela especificam a primeira versão do navegador que suporta totalmente o atributo.
Attribute | |||||
---|---|---|---|---|---|
pattern | 5.0 | 10.0 | 4.0 | Not supported | 9.6 |