Ir para conteúdo
Kefatif

Máscara e verificação de CPF válido

Recommended Posts

Prezados, bom dia.

 

Sou novo no fórum, peço desculpas caso esteja postando no local errado.

 

Estou precisando que o edit abaixo tenha máscara de CPF e verique se o mesmo é válido ou não apresentando mensagem caso seja inválido.

 

Meu código:

<label style="width:15%;">CPF<br><input type="text" id="cpf" step="0.1" name="cpf" class="form-control cpf-mask" placeholder="Ex.: 000.000.000-00" style="width:100%"></label>

 

Já tentei diversas formas e não consegui.

 

Obs.: Sou iniciante em programação web.

 

Agradecido desde já pelas ajudas que estão por vir.

 

Muito obrigado!!!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Não sei se eu entende a pergunta mais vou deixa uns exemplos aqui espero que ajude em alguma coisa

Seria mais o menos isso...

 

MODELO 01

<script>
function CPF(){"user_strict";function r(r){for(var t=null,n=0;9>n;++n)t+=r.toString().charAt(n)*(10-n);var i=t%11;return i=2>i?0:11-i}function t(r){for(var t=null,n=0;10>n;++n)t+=r.toString().charAt(n)*(11-n);var i=t%11;return i=2>i?0:11-i}var n="CPF Inválido",i="CPF Válido";this.gera=function(){for(var n="",i=0;9>i;++i)n+=Math.floor(9*Math.random())+"";var o=r(n),a=n+"-"+o+t(n+""+o);return a},this.valida=function(o){for(var a=o.replace(/\D/g,""),u=a.substring(0,9),f=a.substring(9,11),v=0;10>v;v++)if(""+u+f==""+v+v+v+v+v+v+v+v+v+v+v)return n;var c=r(u),e=t(u+""+c);return f.toString()===c.toString()+e.toString()?i:n}}



   var CPF = new CPF();
   document.write(CPF.valida("123.456.789-00"));
   
   document.write("<br> Teste Validação do CPF NA FRENTE DO CLIENTE<br><br><br>");
   for(var i =0;i<40;i++) {
      var temp_cpf = CPF.gera();
      document.write(temp_cpf+" = "+CPF.valida(temp_cpf)+"<br>");
   }

$(".input").keypress(function(){
    $("#resposta").html(CPF.valida($(this).val()));
});

$(".input").blur(function(){
     $("#resposta").html(CPF.valida($(this).val()));
});
  
</script>

input

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label style="width:15%;">CPF<br>
  <input type="text" id="cpf" step="0.1" name="cpf" class="form-control cpf-mask input" placeholder="Ex.: 000.000.000-00" style="width:100%">
  <span id="resposta"></span><br><br><br><br>
</label>

MODELO 02

<script>
	//Verifica se CPF realmente é válido para ser salvo no banco de dados
	function TestaCPF(strCPF) {
		var Soma, Resto, borda_original;
		Soma = 0;
		
		if (strCPF == "00000000000"){
			document.getElementById("cpf").setCustomValidity('Invalid');
			return false;
		}
		
		for (i=1; i<=9; i++){
			Soma = Soma + parseInt(strCPF.substring(i-1, i)) * (11 - i);
		}
		
		Resto = (Soma * 10) % 11;
		if ((Resto == 10) || (Resto == 11)){
			Resto = 0;
		}
		
		if (Resto != parseInt(strCPF.substring(9, 10))){
			document.getElementById("cpf").setCustomValidity('Invalid');
			return false;
		}
		
		Soma = 0;
		for (i = 1; i <= 10; i++){
			Soma = Soma + parseInt(strCPF.substring(i-1, i)) * (12 - i);
		}
		
		Resto = (Soma * 10) % 11;
		if ((Resto == 10) || (Resto == 11)){
			Resto = 0;
		}
		
		if (Resto != parseInt(strCPF.substring(10, 11))){
			document.getElementById("cpf").setCustomValidity('Invalid');
			return false;
		}
		
		document.getElementById("cpf").setCustomValidity('');
		return true;
	}
</script>

No input

 

<label style="width:15%;">CPF<br>
  <input type="text" id="cpf" step="0.1" name="cpf" class="form-control cpf-mask" required="required" pattern="[0-9]+$" maxlength="11" size="11" placeholder="CPF" onblur="TestaCPF(this.value)" placeholder="Ex.: 000.000.000-00" style="width:100%">
</label>

MODELO 03

<script>
  function ValidaCPF(){	
	var cpf=document.getElementById("cpf").value; 
	var cpfValido = /^(([0-9]{3}.[0-9]{3}.[0-9]{3}-[0-9]{2})|([0-9]{11}))$/;	 
	if (cpfValido.test(cpf) == true)	{ 
	console.log("CPF Válido");	
	} else	{	 
	console.log("Este CPF é Inválido");	
	}
    }
  function fMasc(objeto,mascara) {
obj=objeto
masc=mascara
setTimeout("fMascEx()",1)
}

  function fMascEx() {
obj.value=masc(obj.value)
}

   function mCPF(cpf){
cpf=cpf.replace(/\D/g,"")
cpf=cpf.replace(/(\d{3})(\d)/,"$1.$2")
cpf=cpf.replace(/(\d{3})(\d)/,"$1.$2")
cpf=cpf.replace(/(\d{3})(\d{1,2})$/,"$1-$2")
return cpf
}
  </script>

<label style="width:15%;">CPF<br>
  <input type="text" id="cpf" step="0.1" name="cpf" onkeydown="javascript: fMasc( this, mCPF );" class="form-control cpf-mask" placeholder="Ex.: 000.000.000-00" style="width:100%">
<input type="submit" value="Validar" onclick="ValidaCPF();">
</label>

Tem este outro meio de validar

 

<script>
  function is_cpf (c) {

  if((c = c.replace(/[^\d]/g,"")).length != 11)
    return false

  if (c == "00000000000")
    return false;

  var r;
  var s = 0;

  for (i=1; i<=9; i++)
    s = s + parseInt(c[i-1]) * (11 - i);

  r = (s * 10) % 11;

  if ((r == 10) || (r == 11))
    r = 0;

  if (r != parseInt(c[9]))
    return false;

  s = 0;

  for (i = 1; i <= 10; i++)
    s = s + parseInt(c[i-1]) * (12 - i);

  r = (s * 10) % 11;

  if ((r == 10) || (r == 11))
    r = 0;

  if (r != parseInt(c[10]))
    return false;

  return true;
}


function fMasc(objeto,mascara) {
obj=objeto
masc=mascara
setTimeout("fMascEx()",1)
}

  function fMascEx() {
obj.value=masc(obj.value)
}

function mCPF(cpf){
cpf=cpf.replace(/\D/g,"")
cpf=cpf.replace(/(\d{3})(\d)/,"$1.$2")
cpf=cpf.replace(/(\d{3})(\d)/,"$1.$2")
cpf=cpf.replace(/(\d{3})(\d{1,2})$/,"$1-$2")
return cpf
}

cpfCheck = function (el) {
    document.getElementById('cpfResponse').innerHTML = is_cpf(el.value)? '<span style="color:green">CPF válido</span>' : '<span style="color:red">Este CPF é inválido</span>';
    if(el.value=='') document.getElementById('cpfResponse').innerHTML = '';
}
<p>Digite o CPF
</script>

no input

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">

<label style="width:15%;">CPF<br>
  <input type="text" id="cpf" step="0.1" name="cpf" onkeyup="cpfCheck(this)" maxlength="18" onkeydown="javascript: fMasc( this, mCPF );" class="form-control cpf-mask" placeholder="Ex.: 000.000.000-00" style="width:100%">
<span id="cpfResponse"></span>
</label>

Questão de duvida veja aqui...

veja aqui mais ex:

Compartilhar este post


Link para o post
Compartilhar em outros sites

Normalmente em aplicações quando precisamos validar CPF, também precisamos além de pessoas físicas validar pessoas jurídicas então preparei esse exemplo tanto para verificação de CPF quando para CNPJ.

 

Note que teremos 2 tipos de filtros...

Um usando expressão regular, o que obriga a pessoa ter que digitar o campo de forma correta. Do contrário o formulário não pode ser submetido.

Um usando script, que vai limpando qualquer caractere que não se enquadre no que é permitido.

Fica a seu critério o que usar ou cominar os dois.

Também a validação do lado do servidor, que é extremamente necessária pois tanto HTML como JS podem ser manipulados pelo usuário.

<form method="POST">
    <p>Usando expressão regular</p>
    <input
        type="text"
        name="expressao"
        minlength="14"
        maxlength="18"
        pattern="([0-9]{2}[\.]?[0-9]{3}[\.]?[0-9]{3}[\/]?[0-9]{4}[-]?[0-9]{2})|([0-9]{3}[\.]?[0-9]{3}[\.]?[0-9]{3}[-]?[0-9]{2})"
        />

    <p>Usando script</p>
    <input
        type="text"
        name="script"
        minlength="14"
        maxlength="18"
        onkeypress="mask(this, cpfCnpj)"
        onblur="clearTimeout()"
        />

    <hr />
    <button>Executar</button>
</form>

<?php
if (isset($_POST) && count($_POST)) {
    require_once(__DIR__ . DIRECTORY_SEPARATOR . 'StrValid.php');
    $valido = new StrValid();
    if ($valido->checkCpfCnpj($_POST['expressao'])) {
        echo("<p>O post expressao é um CPF ou CNPJ válido</p>");
    }
    if ($valido->checkCpfCnpj($_POST['script'])) {
        echo("<p>O post expressao é um CPF ou CNPJ válido</p>");
    }
    echo("<pre>");
    var_dump($_POST);
    echo("</pre>");
}
?>


<script>
    function mask(o, f) {
        v_obj = o;
        v_fun = f;
        setTimeout('obMask()', 1);
    }
    function obMask() {
        v_obj.value = v_fun(v_obj.value);
    }
    function cpfCnpj(v) {
        v = v.replace(/\D/g, ''); //Remove tudo o que não é dígito
        if (v.length <= 13) { //CPF
            v = v.replace(/(\d{3})(\d)/, '$1.$2'); //Coloca um ponto entre o terceiro e o quarto dígitos
            v = v.replace(/(\d{3})(\d)/, '$1.$2'); //Coloca um ponto entre o terceiro e o quarto dígitos de novo (para o segundo bloco de números)
            v = v.replace(/(\d{3})(\d{1,2})$/, '$1-$2'); //Coloca um hífen entre o terceiro e o quarto dígitos
        } else { //CNPJ
            v = v.replace(/^(\d{2})(\d)/, '$1.$2'); //Coloca ponto entre o segundo e o terceiro dígitos
            v = v.replace(/^(\d{2})\.(\d{3})(\d)/, '$1.$2.$3'); //Coloca ponto entre o quinto e o sexto dígitos
            v = v.replace(/\.(\d{3})(\d)/, '.$1/$2'); //Coloca uma barra entre o oitavo e o nono dígitos
            v = v.replace(/(\d{4})(\d)/, '$1-$2'); //Coloca um hífen depois do bloco de quatro dígitos
        }
        return v;
    }
</script>

 

Classe StrValid

<?php
/**
 * ********************************************
 * * @class StrValid
 * * @copyright (c) Spell master
 * * @version 2.1
 * * @see Classe para verificação de string
 * ********************************************
 */

class StrValid {

    /**
     * ****************************************
     * Verificar se uma string possui somente 
     *  caracteres alfabéticos "Não acentuados
     *  e sem espaços"
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function strCheck($subject) {
        if (preg_match('/^([a-zA-Z]+)$/i', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string possui somente 
     *  caracteres numéricos
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function intCheck($subject) {
        if (preg_match('/^([0-9]+)$/i', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string possui somente 
     *  caracteres alfabéticos "Incluíndo
     *  acentos"
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function strAccent($subject) {
        if (preg_match('/^([a-zA-ZÀ-ú]+)$/i', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string possui somente 
     *  caracteres alfabéticos "Incluíndo
     *  espaços"
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function StrSpace($subject) {
        if (preg_match('/^([a-zA-Z ]+)$/i', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string possui somente 
     *  caracteres numéricos "com ou sem
     *  espaços"
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function intSpace($subject) {
        if (preg_match('/^([0-9 ]+)$/i', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string possui somente 
     *  caracteres alfabéticos ou numéricos
     *  "sem espaços ou acentos"
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function strInt($subject) {
        if (preg_match('/^([a-zA-Z0-9]+)$/i', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string possui somente 
     *  caracteres alfabéticos ou numéricos
     *  "incluíndo espaços ou acentos"
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function strIntSpace($subject) {
        if (preg_match('/^([a-zA-Z À-ú 0-9]+)$/i', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string possui somente 
     *  caracteres alfabéticos "Incluíndo
     *  acentos ou espaços"
     * - Tipo de verificação padrão para nomes
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function nameCheck($subject) {
        if (preg_match('/^([a-zA-Z À-ú]+)$/i', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string possui somente
     *  caracteres para uma url válida
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * @example :
     * - https://url/?entrada_get=algum-valor
     *   Retorna true por ser válido
     * - /algumacoisa
     *   Retorna true por ser válido
     * ****************************************
     */
    public function urlCheck($subject) {
        if (preg_match('/^([a-zA-Z0-9-_:\/?&=%]+)$/i', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string possui somente 
     *  caracteres válidos para um endereço de
     *  e-mail.
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function mailCheck($subject) {
        if (preg_match('/^([a-zA-Z0-9_\-\.]+)@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.)|(([a-zA-Z0-9\-]+\.)+))([a-zA-Z]{2,4}|[0-9]{3})$/', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string é um tipo de
     *  telefone válido.
     * @example :
     * - +55 (99) 99999-9999
     * - 99 99999-8888
     * - 9999-9999
     * - 9999999999999
     *   Ambos números são válidos.
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function checkPhone($subject) {
        if (preg_match('/^(?:(?:\+|00)?(55)\s?)?(?:\(?([1-9][0-9])\)?\s?)?(?:((?:9\d|[2-9])\d{3})\-?(\d{4}))$/', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string é um tipo de
     *  CPF válido.
     * @example :
     * - 000.000000-00
     *   CPF é válido.
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function checkCpf($subject) {
        if (preg_match('/^([0-9]{3}[\.][0-9]{3}[\.][0-9]{3}[-][0-9]{2})$/', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string é um tipo de
     *  CNPJ válido.
     * @example :
     * - 00.000.000/0000-00
     *   CNPJ é válido.
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function checkCnpj($subject) {
        if (preg_match('/^([0-9]{2}[\.][0-9]{3}[\.][0-9]{3}[\/][0-9]{4}[-][0-9]{2})$/', $subject)) {
            return (true);
        }
    }

    /**
     * ****************************************
     * Verificar se uma string é um tipo de
     *  CPF ou CNPJ válido.
     * @example :
     * - 000.000000-00
     * - 00000000000
     *   CPF é válido.
     * 
     * - 00.000.000/0000-00
     * - 00000000000000
     *   CNPJ é válido.
     * ****************************************
     * @param {string} $subject
     * Entrada para verificação
     * @return {true} (A string é valida)
     * ****************************************
     */
    public function checkCpfCnpj($subject) {
        if (preg_match('/^([0-9]{3}[\.]?[0-9]{3}[\.]?[0-9]{3}[-]?[0-9]{2})|([0-9]{2}[\.]?[0-9]{3}[\.]?[0-9]{3}[\/]?[0-9]{4}[-]?[0-9]{2})$/', $subject)) {
            return (true);
        }
    }
}

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Crie uma conta ou entre para comentar

Você precisar ser um membro para fazer um comentário

Criar uma conta

Crie uma nova conta em nossa comunidade. É fácil!

Crie uma nova conta

Entrar

Já tem uma conta? Faça o login.

Entrar Agora

  • Conteúdo Similar

    • Por Kaio Augusto de Castro
      Ola pessoal, estou com uma duvida que eu não sei nem como me expressar, mas mesmo assim irei tentar.
       
      Gostaria de saber se é possível mostrar apenas um fomulário em meu site sem o conteúdo do resto, queria fazer uma espécie de "mascara" para esconder coisas que eu não quero que seja mostrado em meu site e mostrar somente aquilo que me interessa assim como descreve as imagens abaixo. 
       
      A imagem 01 é como aparece a pagina, na imagem 02 é como eu gostaria que aparecesse na minha pagina, apenas o formulário em as propagandas da empresa que fornece a hospedagem.


    • Por marcelobbt
      Encontrei um código para formatar o valor da forma que eu quero, o problema que ele aciona o script para todos os inputs (ver abaixo)
      $(function(){ $('input').bind('keypress',mask.money) }); Porém queria aplicar apenas a um dos inputs do meu form.
       
      Abaixo segue o script completo
      var mask = { money: function() { var el = this ,exec = function(v) { v = v.replace(/\D/g,""); v = new String(Number(v)); var len = v.length; if (1== len) v = v.replace(/(\d)/,"0.0$1"); else if (2 == len) v = v.replace(/(\d)/,"0.$1"); else if (len > 2) { v = v.replace(/(\d{2})$/,'.$1'); } return v; }; setTimeout(function(){ el.value = exec(el.value); },1); } } $(function(){ $('input').bind('keypress',mask.money) }); o input seria o abaixo:
      <input type="text" id="valorform" name="valorform">  
    • Por klonder
      Tentei incluir a máscara a seguir em um POST meu antigo, porém está fechado para novas respostas:
       
      Todavia, para futuras consultas minhas e também para ajudar outras pessoas, venho deixar uma máscara interessante que acabei de terminar em JavaScript.
      Ficou muito menor que a do POST acima:
      <script type="text/javascript"> var iCount1; var trava = false; function MaskDown(e) { if (trava == false) { iCount1 = e.value.length; trava = true; } } function MaskUp(e,mascara) { if (trava) { var textoLimpo = e.value.substr(0,iCount1+1).replace(/[\/\:\-\.]/g,""); var texto = ""; var iM = 0; var iT = 0; while (iM < mascara.length) { if (iT < textoLimpo.length) { if (mascara.substr(iM,1) == "#") { texto += textoLimpo.substr(iT,1); iT++; } else { texto += mascara.substr(iM,1); } } iM++; } e.value = texto; trava = false; } } </script> Para funcionar, basta incluir em suas tags input os eventos, como demonstrado a seguir:
      <input type="text" id="tfData" onkeydown="MaskDown(this)" onkeyup="MaskUp(this,'##/##/####')" placeholder="dd/mm/aaaa" style="width:80px" /> <br /><input type="text" id="tfHora" onkeydown="MaskDown(this)" onkeyup="MaskUp(this,'##:##')" placeholder="hh:mm" style="width:50px"/> À medida que o usuário vai digitando, o valor campo vai sendo formatado. Pode ser usado para CPF, CEP, RG, dentre outros...
       
      Divirtam-se!
    • Por Bruno_Roberto
      Olá, tudo bem? sou novo na comunidade mas preciso de ajuda, eu gostaria de fazer um cadastro único onde o campo de texto formatado do CPF sirva para CNPJ, por exemplo:
      Se (campo_de_texto.Lenght > CPF.lenght)
      {
          Mascara == CNPJ;
      }else
      {
          Mascara == CPF;
      }
       
      Essa é a lógica, só não sei como aplicar... alguém poderia me ajudar?
    • Por Bruno_Roberto
      Olá, tudo bem? sou novo na comunidade mas preciso de ajuda, eu gostaria de fazer um cadastro único onde o campo de texto formatado do CPF sirva para CNPJ, por exemplo:
      Se (campo_de_texto.Lenght > CPF.lenght)
      {
          Mascara == CNPJ;
      }else
      {
          Mascara == CPF;
      }
       
      Essa é a lógica, só não sei como aplicar... alguém poderia me ajudar?
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.