tutoriais mais recente desenvolvimento web
 

HTML pattern Attribute


Definição e Uso

O pattern atributo especifica uma expressão regular que o <input> valor de elemento de é verificado contra.

Nota: O pattern atributo funciona com os seguintes tipos de entrada: text, date, search, url, tel, email e password .

Dica: Use o mundial title atributo para descrever o padrão para ajudar o usuário.

Sugestão: Saiba mais sobre expressões regulares em nosso tutorial JavaScript.


Aplica-se a

O pattern atributo pode ser utilizado no elemento seguinte:

Elemento Atributo
<input> pattern

Exemplos

Input Exemplo

Um formulário HTML com um campo de entrada que pode conter apenas três letras (não há números ou caracteres especiais):

<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>
Tente você mesmo "

Password Exemplo

Um <input> elemento com type="password" que deve conter 6 ou mais caracteres:

<form action="demo_form.asp">
Password: <input type="password" name="pw" pattern=".{6,}" title="Six or more characters">
<input type="submit">
</form>
Tente você mesmo "

Password Exemplo

Um <input> elemento com type="password" que deve conter 8 ou mais caracteres que são de pelo menos um número e uma maiúscula e letra minúscula:

<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>
Tente você mesmo "

Browser Suporte

Os números na tabela especificar a primeira versão do browser que suporta totalmente o atributo.

Atributo
pattern 5 10.0 4.0 Não suportado 9,6