Atributo de padrão HTML


Definição e uso

O patternatributo especifica uma expressão regular com a qual o <input>valor do elemento é verificado.

Nota: O patternatributo funciona com os seguintes tipos de entrada: texto, data, pesquisa, url, tel, email e senha.

Dica: Use o atributo global titlepara 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 patternatributo 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