Diversas máscaras com ER

A referência do criador desse script está aqui:
http://elcio.com.br/ajax/mascara/

de minha autoria, é a máscara mvalor, e mais algumas simples como a mrg

/* Máscaras ER */
function mascara(o,f){
    v_obj=o
    v_fun=f
    setTimeout("execmascara()",1)
}
function execmascara(){
    v_obj.value=v_fun(v_obj.value)
}
function mcep(v){
    v=v.replace(/\D/g,"")                    //Remove tudo o que não é dígito
    v=v.replace(/^(\d{5})(\d)/,"$1-$2")         //Esse é tão fácil que não merece explicações
    return v
}
function mtel(v){
    v=v.replace(/\D/g,"");             //Remove tudo o que não é dígito
    v=v.replace(/^(\d{2})(\d)/g,"($1) $2"); //Coloca parênteses em volta dos dois primeiros dígitos
    v=v.replace(/(\d)(\d{4})$/,"$1-$2");    //Coloca hífen entre o quarto e o quinto dígitos
    return v;
}
function cnpj(v){
    v=v.replace(/\D/g,"")                           //Remove tudo o que não é dígito
    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
}
function mcpf(v){
    v=v.replace(/\D/g,"")                    //Remove tudo o que não é dígito
    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
    return v
}
function mdata(v){
    v=v.replace(/\D/g,"");                    //Remove tudo o que não é dígito
    v=v.replace(/(\d{2})(\d)/,"$1/$2");
    v=v.replace(/(\d{2})(\d)/,"$1/$2");

    v=v.replace(/(\d{2})(\d{2})$/,"$1$2");
    return v;
}
function mtempo(v){
    v=v.replace(/\D/g,"");                    //Remove tudo o que não é dígito
    v=v.replace(/(\d{1})(\d{2})(\d{2})/,"$1:$2.$3");
    return v;
}
function mhora(v){
    v=v.replace(/\D/g,"");                    //Remove tudo o que não é dígito
    v=v.replace(/(\d{2})(\d)/,"$1h$2");
    return v;
}
function mrg(v){
    v=v.replace(/\D/g,"");                                      //Remove tudo o que não é dígito
        v=v.replace(/(\d)(\d{7})$/,"$1.$2");    //Coloca o . antes dos últimos 3 dígitos, e antes do verificador
        v=v.replace(/(\d)(\d{4})$/,"$1.$2");    //Coloca o . antes dos últimos 3 dígitos, e antes do verificador
        v=v.replace(/(\d)(\d)$/,"$1-$2");               //Coloca o - antes do último dígito
    return v;
}
function mnum(v){
    v=v.replace(/\D/g,"");                                      //Remove tudo o que não é dígito
    return v;
}
function mvalor(v){
    v=v.replace(/\D/g,"");//Remove tudo o que não é dígito
    v=v.replace(/(\d)(\d{8})$/,"$1.$2");//coloca o ponto dos milhões
    v=v.replace(/(\d)(\d{5})$/,"$1.$2");//coloca o ponto dos milhares

    v=v.replace(/(\d)(\d{2})$/,"$1,$2");//coloca a virgula antes dos 2 últimos dígitos
    return v;
}

Forma de uso

<input type="text" onkeyup="mascara(this, mvalor);" />

Se você está precisando de uma máscara para telefone com o nono dígito, veja aqui: mascara com expressão regular do nono dígito do estado de são paulo.

26 Comments

  1. Prabéns pelo artigo, é dificíl encontrar raridades como esta que estajam em estado funcional! Abraços…

  2. Prezado, tem uma função para escrever somente letras e números e em minúsculos ?

    • Basta fazer a ER amigo:

      function mletrasnumeros( v ){
      	v=v.replace(/[^a-z0-9]/g,"");//Remove tudo o que não é dígito ou letra minuscula 
          return v; 
      }
  3. Em SP existe uma peculiaridade, uma vez que os celulares têm mais um digito que os fixos. Como configurar a máscara para quando for colocado o (11) para o campo cel, seja liberado mais um dígito pela máscara?
    Obrigado.

  4. segue um que funciona para numeros com 8 ou 9 digitos:

    function celularComDDD(v) {	
    	
        v = v.replace(/\D/g, "");//remove tudo o que não é dígito
    	
    	if(v.length === 1){
    		v = "(" + v;//coloca o primeiro parênteses
    	}
    	else{
    		v = v.replace(/^(\d\d)/g, "($1) ");//coloca parênteses em volta dos dois primeiros dígitos
    		
    		if(v.length > 13){
    			v = v.replace(/(\d{5})(\d)/, "$1-$2");//coloca hífen entre o quinto e o sexto dígitos
    		}
    		else{
    			v = v.replace(/(\d{4})(\d)/, "$1-$2");//coloca hífen entre o quarto e o quinto dígitos
    		}
    	}
    	
        return v;
    }
    • Olá!
      Neste caso, se o celular ou telefone não possuir o ddd, como devo fazer, estou começando a programar com js.

      Grato pela Atenção!

  5. Cara… como faço uma mascara que com duas casas decimais e com o sinal de % no final? e que aceite somente até 100,00%

  6. Parabéns, cara. Excelente artigo. Me ajudou a acertar as máscaras nos browsers mobile, pois não consegui fazer o meiomask funcionar e seu código funcionou perfeitamente.
    Abraço!

  7. A máscara de CNPJ é ótima, mais percebi que ela deixar ultrapassar a quantidade máxima de dígitos depois do último traço, como faz para que isso não aconteça?

  8. Como seria uma expressão dessa para placa de carro?

  9. Bruno, eu sei como faz uma expressão regular para placa de carro, porém não consigo fazer uma função em javascript como você fez. Tem como você postar o código de como ficaria a função?

    Obs. Sou o mesmo da pergunta a cima

  10. Renato Nankran

    agosto 25, 2015 at 22:46

    Oi bruno eu to tentando usar essa mascara de virgula antes dos dois ultimos digitos assim:

          window.onload = decimal;
              
              function decimal()
              {
                document.getElementById("preco").onkeyup = function()
                {
                var valor = document.getElementById("preco").value;
                    
                valor=valor.replace(/([\d]+)\.([\d]{2})/g, "$1,$2");//coloca a virgula antes dos 2 últimos dígitos
                document.getElementById("preco").value = valor;
                }
              }
          

    mas nao ta funcionando

  11. Bruno Fugivara Grenier

    setembro 15, 2015 at 15:44

    Muito bom! Excelente! Parabéns pelo artigo.

  12. George Harrison

    setembro 17, 2015 at 15:18

    Muito loko, foi de grande ajuda…
    Só tenho uma pegunta seria possível colocar a mascara qdo a pessoa clica no campo?
    ex.:
    telefone: (__)_____-_____
    data de aniversario: __/__/____
    Teria como ser feito?

  13. Como seria uma máscara para RG e uma para placa de carro?

  14. Parabéns pelo blog William, a minha dúvida é de como aplicar isso nas consultas que eu faço no banco, sou iniciante e a empresa que eu trabalho usa asp clássico como linguagem de banco, então eu n queria fazer isso via asp até mesmo por que eu não achei nada na net, tem alguma chamada que eu faça pra ele aplicar essas mascaras fora do formulário?

  15. Obrigado. Ajudou com meu trabalho da faculdade.

  16. Olá, sou iniciante em javascript e html e estou utilizando a mascara. Funciona que é uma beleza, mas apliquei a uma página que carrega o conteúdo dinamicamente de um bd e dae não vem mascarado, a não ser que eu apague e escreva de novo.

    como posso corrigir isso?

  17. Também sou novato no assunto e gostaria de uma ajuda sua, como faço para quando o usuário digitar menos de de 8 digitos ou não digitar nenhum número ele da um alert ( “formato de telefone incorreta!”) usando o onBlur=”ValidaTelefone(form1.tel);”> ?

  18. Olá,
    Estou tentando usar para CPF, mas esta entrando virgula no lugar do ponto. Pode me ajudar?

    function mascara(o, f) {
        v_obj = o;
        v_fun = f;
        setTimeout("execmascara()", 1);
    }
    function execmascara() {
        v_obj.value = v_fun(v_obj.value);
    }
    function cpf(v) {
        v = v.replace(/\D/g, "");                       //Remove tudo o que não é dígito
        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
        return v;
    }
    

    Obrigado.

Deixe uma resposta

Your email address will not be published.

*