Máscara CPF com JS

Como formatar o CPF com JavaScript

Formatar CPF em JavaScript ainda hoje é algo fundamental para os desenvolvedores que estão trabalhando em softwares para a web.

código de máscara cpf em js

Isso porque isso não só ajuda o sistema a identificar CPFs válidos como também evita que sejam inseridos caracteres indevidos em vez de números.

Para tanto, porém, é importante trabalhar com uma Máscara jQuery no JS, o objetivo é naturalmente tornar a aplicação eficiente, não só na fase do teste, mas após seu lançamento.

Com isso em mente, portanto, apresentamos um modelo onde é possível notar como funciona a implementação. Veja!

Implementando Máscara com jQuery para formatar CPF

De modo geral, é fato que o jQuery é um grande aliado do programador. Mas em se tratando de máscara de CPF, a coisa fica ainda melhor, pois a implementação é absolutamente simples.

Para tanto, basta obter dois códigos de scripts prontos:

Depois de feito o procedimento com os códigos, basta incluir os scripts no código HTML da página pretendida. Eles entram naturalmente, imediatamente antes do fechamento da tag head, conforme pode ser visto no exemplo a seguir.

<head>
...
<script type="text/javascript" src="js/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="js/jquery.maskedinput.min.js"/></script>
</head>

Feito isso, a próxima linha é onde se inicializa a máscara com jQuery. Nesse caso o padrão seguido é o ilustrado abaixo.

<script type="text/javascript">
	$(document).ready(function(){
		$("#cpf").mask("999.999.999-99");
	});
</script>

Na sequência, o que deve ser feito é a criação do formulário com o uso do atributo id=”cpf” no campo de CPF, como também pode ser observado logo na sequência.

<form name="form" method="post" action="">
	<input name="cpf" type="text" id="cpf"/>
</form>

Visite este link (https://ogeradordecpf.com.br/validar-javascript/) para ver como validar o CPF com JS.

Processo terminado

Concluído o processo citado, a máscara de CPF já estará pronta e funcionando. Assim se tem todo o necessário para formatar CPF em JS. É importante notar que logo de cara ele já impede que caracteres não numéricos sejam digitados no espaço do CPF.

Isso significa que sempre que alguém tentar incluir no campo alguma letra, ponto, traço ou caracteres especiais, o próprio sistema impedirá. Essa ação por si só já minimiza as chances do sistema ser burlado.

Não obstante, nas ocasiões em que um usuário pare de digitar sem completar o preenchimento dos campos necessários o script também reseta os valores preenchidos. Isso porque detecta um erro no preenchimento.

Se você pretende gerar e validar CPF para testar em suas aplicações, visite a nossa página inicial em https://ogeradordecpf.com.br/.

Tal vez lhe interesse saber como formatar CPF no Excel.