Máscara de CEP com jQuery
Há muito tempo o jQuery vem facilitando a vida dos programadores web. Implementar uma máscara de CEP é extremamente simples e rápido utilizando esta tecnologia, algo que no passado era uma chatice de se fazer.
Você vai precisar importar os dois scripts a seguir em seu código HTML. Salve-os em seu computador clicando sobre eles com o botão direito do mouse.
Adicione as linhas de importação dos dois javascripts imediatamente antes de fechar a tag head de sua página, como ilustrado abaixo:
<title>Título da sua Página</title> ... <script type="text/javascript" src="jquery-1.2.6.pack.js"></script> <script type="text/javascript" src="jquery.maskedinput-1.1.4.pack.js"/></script>
Após as linha de importação, inicialize a máscara com jQuery da seguinte forma:
<script type="text/javascript">
$(document).ready(function(){
$("#cep").mask("99.999-999");
});
</script>
Nota: Se você quiser utilizar o formato 99999-999 basta remover o "." da máscara.
Crie agora seu form e utilize o atributo id='cep' no textfield que corresponde ao campo de CEP:
<form name="formulario" action="" method="get"> <input name="cep" id="cep" type="text"/> </form>
A máscara de CEP está pronta! Tente pressionar no campo de exemplo abaixo letras, ponto, hífen ou outros caracteres diferente de números. Repare que o script impede a digitação destes caracteres sem que você digite nem mais uma linha de código.
Vale ressaltar ainda que caso o usuário interrompa a digitação e pule para o próximo campo sem o preenchimento dos oito números necessários, o script automaticamente limpa o valor preenchido assumindo uma condição de erro.
Exemplo - Teste a máscara em funcionamento:Veja a máscara de CEP aplicada e funcionando na página buscar endereço por cep aqui do site.