Skip to content

Instantly share code, notes, and snippets.

@marcoscastro
Last active June 11, 2024 20:29
Show Gist options
  • Save marcoscastro/7887900ceebe9e223dce to your computer and use it in GitHub Desktop.
Save marcoscastro/7887900ceebe9e223dce to your computer and use it in GitHub Desktop.
HTML 5 - Validando formato de CPF
<html>
<head>
<title>Formato CPF</title>
<script src="script.js"></script>
</head>
<body>
<h3>Digite seu CPF:</h3>
<form name="cadastro">
<input type="text" name="cpf" \
pattern="\d{3}\.\d{3}\.\d{3}-\d{2}" \
title="Digite um CPF no formato: xxx.xxx.xxx-xx">
<input type="submit" value="Verificar">
</form>
</body>
</html>
@kozfelipe
Copy link

torne os pontos e traço opcionais aceitando a entrada só de números como válida também
\d{3}\.?\d{3}\.?\d{3}-?\d{2}

@jesobreira
Copy link

É possível aceitar CPF e CNPJ no mesmo campo usando pattern="(\d{3}\.?\d{3}\.?\d{3}-?\d{2})|(\d{2}\.?\d{3}\.?\d{3}/?\d{4}-?\d{2})"

@claudesenvolvedor
Copy link

Por gentileza meus nobres colegas. Estou no início de um novo aprendizado e como sou cego, as dificuldades são ainda maiores, mas vamos em busca de aprendizado. Como ficaria a linha adicionando esta opção a mais citada pelo colega que valida também sem a necessidade dos pontos e traço? Poderia escrever as linhas para meu estudo e observação?

@kozfelipe
Copy link

kozfelipe commented Oct 3, 2021

@claudesenvolvedor
<input type="text" name="cpf" pattern="(\d{3}\.?\d{3}\.?\d{3}-?\d{2})|(\d{2}\.?\d{3}\.?\d{3}/?\d{4}-?\d{2})">

@ceaugomes
Copy link

ceaugomes commented May 30, 2022

Como faço para garantir que apenas números sejam inseridos no input type="text" em um formulário HTML?

@richardsonasilva
Copy link

@EzequielAnjos
Copy link

Obrigado, muito útil

@danielbrasc
Copy link

danielbrasc commented Nov 20, 2022

@ceaugomes

Uma das formas de garantir apenas números no input type="text"

https://stackoverflow.com/a/28838789

@lblem
Copy link

lblem commented Nov 23, 2022

só colocar type="number" ao invés de text.

@MauricioSarmento
Copy link

Basta colocar o type="number_format"

@halecvinicius
Copy link

por gentileza saberiam informar se existem como deixar os caracteres ponto e traço no campo de preencimento de forma obrigatoria?

image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment