2

Estou com um problema de validação no client-side no caso estou querendo validar o campo CEP, preciso que ele apenas aceite os 9 números do CEP da pessoa e o traço - do CEP, quem poder ajudar agradeço desde já.

Esta é uma parte do codigo:

if(isNaN(cep) || tc.length<10){
   alert('digite seu cep corretamente');
   document.form.cep.style.background='red';
   return false;
}

Este código esta entrando em conflito com minha necessidade pois coloquei pra aceitar apenas numero com o isNaN e não sei como fazer para aceitar números e apenas um caractere especial.

3 Respostas 3

2

Sugiro teres uma função que limpa os espaços em branco e depois verifica a estrutura 5 digitos > traço > 3 digitos. Poderia ser assim:

function isCEP(str) {
    return !!str.split(' ').join('').match(/^\d{5}\-\d{3}$/);
}

['12345-678', '123 45 - 678 ', '12345678', '1234-5678'].forEach(function(cep) {
    console.log(isCEP(cep));
});

Na regex uso \d que quer dizer numero/digito, \- que quer dizer traço, e {x} que quer dizer que espera x vezes o tipo de caracter antes do {} na regex.

2

Seu código ficaria assim com uma verificação por regex:

if (!/^[0-9]{5}\-[0-9]{3}$/.test(cep)){
   alert('digite seu cep corretamente');
   document.form.cep.style.background='red';
   return false;
}

EDIT 1

Complementando com alguma explicação seguindo o exemplo do @Sergio♦

Na regex acima o ^ significa o começo da cadeia de caracteres, ou seja, não será aceito nada diferente do que se segue. O [0-9] quer dizer que são aceitos dígitos de 0 a 9. O {X} diz a quantidade de vezes que o termo anterior irá aparecer consecutivamente. O \- significa exatamente o caractere -. O $ exige que seja o final da cadeia de caracteres, impedindo assim que haja mais alguma coisa após o que foi testado. A sequência [0-9] também pode ser alterada para \d, e o resultado seria o seguinte:

/^\d{5}\-\d{3}$/
4
  • 2
    Acho que a regex poderia ser melhorada para /^[0-9]{2}.[0-9]{3}-[0-9]{3}$/ já que a que você postou permite CEPs assim "h12345-678" e assim "12345-7890" Commented 2/11/2016 às 0:47
  • É verdade, vou editar com a sua sugestão
    – Sorack
    Commented 2/11/2016 às 0:47
  • 1
    Em regex - é um caracter especial e deve ser escapado.
    – Sergio
    Commented 2/11/2016 às 6:57
  • Vou melhorar isso também então
    – Sorack
    Commented 2/11/2016 às 12:02
1

Uma alternativa seria utilizar um plugin de máscara com jQuery:

$('#txtCep').mask('99999-999');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<script src="https://cloud.github.com/downloads/digitalBush/jquery.maskedinput/jquery.maskedinput-1.3.js"></script>

<form>
  CEP: <input type="text" id="txtCep" />
</form>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .