Máscara para CNPJ
Olá,
Neste meu primeiro artigo, quero mostrar algo simples mas que é de grande ajuda para quem precisa trabalhar com máscaras numéricas.
Neste exemplo vou mostrar como fazer uma máscara para um campo de CNPJ:
script.js
window.onload = function()
{
document.getElementById(“cnpj”).onkeypress = function()
{
nCaract = document.getElementById(“cnpj”)switch(nCaract.value.length)
{
case 2: nCaract.value += “.”;
break;case 6: nCaract.value += “.”;
break;case 10: nCaract.value += “/”;
break;case 15: nCaract.value += “-”;
break;
}
}
}
Arquivo HTML:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>Máscara de Campo Numérico</title>
<script type=”text/javascript” src=”script.js”></script>
</head><body>
<label for=”cnpj”><img src=”cnpj.jpg” alt=”Modelo de CNPJ” width=”400″ height=”172″ /><br />
C.N.P.J.</label>
<input type=”text” id=”cnpj” size=”20″ maxlength=”18″ />
<input type=”button” id=”Enviar” value=”Enviar” />
</body>
</html>
Explicando o código:
window.onload = function(){
//Ao carregar o arquivo
document.getElementById(“cnpj”).onkeypress = function()
//Ao pressionar uma tecla no campo cnpj
{
nCaract = document.getElementById(“cnpj”)
//Instanciando o campo CNPJ
//nCaract.value.length Retorna a quantidade de caracteres a cada tecla digitada
switch(nCaract.value.length)
{
case 2: nCaract.value += “.”;
break;
case 6: nCaract.value += “.”;
break;
case 10: nCaract.value += “/”;
break;
case 15: nCaract.value += “-”;
break;
}
Quando houver dois caracteres no campo será acrescentado o ponto, ao continuar preenchendo quando houver seis caracteres será acrescentado mais um ponto, quando tiver 10 caracteres será acrescentado a barra e quando houver quinze caracteres será acrescentado o hífen.
Bom pessoal é um artigo simples, mas dá um toque especial para o formulário, podendo ser utilizado para campos que recebem CPFs, CNPJs, Datas, CEP, telefones entre outros.
Demostração:
http://www.mxstudio.com.br/wp-content/uploads/2008/04/mascara.htm
Escrito por Marcio_Diniz
on abril 19, 2008. Arquivado em Javascript.
Você pode seguir as respostas a esse artigo pelo RSS 2.0.
Você pode deixar respostas para esse artigo
4 respostas a Máscara para CNPJ
Deixe uma resposta
Autor do Artigo
Marcio Diniz
Bem legal isso Márcio.
Já precisei de algo parecido e encontrei na Internet códigos completamente indecifráveis.
Ótimo código e muito boa sua foma de conduzir o assunto.
Esperava ansioso por uma seção de JavaScript no MXSTUDIO, espero ver mais textos em breve.
Abraço
Quase bom!
quando o usuario apaga o que digitou ele entra em loop!
;p
bug na hora de apagar no firefox =\
Confirmado o bug, quando se digita o CNPJ e vc vai apaga-lo usando o Backspace quando chega na pontuação pré programada ele nao segue apagando. Alguma dica?