3

Eu uso o plugin abaixo nos meus campos html para fazer a mascara, me surgiu a necessidade de colocar a mascara de cnpj e cpf no mesmo campos, alguém sabe como fazer isso com esse plugin?

http://digitalbush.com/projects/masked-input-plugin/

$("#cpf").mask("999.999.999-99");
$("#cnpj").mask("99.999.999/9999-99");

Obrigado.

3
  • Com outro plugin eu sei q da p fazer, poderia colocar o formato do cpf e cnpj.
    – rray
    7/04/2016 às 18:32
  • Então o que gosto nesse é que a aparência dele é perfeita, pois quando vc clica no campo ele aparece, diferente de outros que vai aparecendo conforme vai digitando. Não sei se eu colocar outro plugin vai conflitar com esse plugin que já esta sendo usado em outros campos. 7/04/2016 às 18:36
  • @Bacco eu não consegui fazer funcionar com a resposta que vc mencionou ser duplicada, la não tem referencia do plugin que esta sendo usado. 7/04/2016 às 18:39

2 Respostas 2

5

Pode usar o plugin jquery.inputmask para mascarar uma entrada com formatos diferentes. O código a seguir define dois formatos o primeiro para o cpf e o segundo para o cnpj, quando o usuário digitar o 15º a máscara mudará de cpf para cpnj isso é feito com a opção keepStatic: true que 'segura' o formato até a entrada casar com o próximo.

$("#doc").inputmask({mask: ['999.999.999-99', '99.999.999/9999-99'], keepStatic: true });
12
  • Obrigado, vou testar ele agora. 7/04/2016 às 18:48
  • rray ele funcionou perfeitamente, sabe me dizer se existe possibilidade dele conflitar com o outro plugin? Existe algum problema em usar os dois na mesma pagina? 7/04/2016 às 19:20
  • @MauricioFerraz acreito que não pode usar tranquilo só não confundir os nome que são parecidos xD
    – rray
    7/04/2016 às 19:22
  • rray me tire apenas mais uma duvida, vc sabe se existe a opção da mascara aparecer no campo apenas quando ele for clicado invés do hover (quando coloca a seta do mouse em cima)? 7/04/2016 às 19:39
  • 1
    @MauricioFerraz tem sim, adicione , showMaskOnHover: false depois de keepStatic: true
    – rray
    7/04/2016 às 19:44
2

Eu criei e utilizo essa solução à anos em jQuery para o próprio Plugin Maskedinput da Digitalbush:

$(".hibridCpf").on('focusin',function(){
    var target = $(this);
    var val = target.val();
    target.unmask();
    val = val.split(".").join("");
    val = val.split("-").join("");
    val = val.split("/").join("");
    target.val(val);
});
$(".hibridCpf").on('focusout',function(){
    var target = $(this);
    var val = target.val();
    val = val.split(".").join("");
    val = val.split("-").join("");
    val = val.split("/").join("");
    if (val.length==11) {
        target.mask("999.999.999-99");
        target.val(val);
    } else {
        if (val.length==14) {
            target.mask("99.999.999/9999-99");
            target.val(val);
        } else {
            target.val('');
        }
    }
});

Teste esse exemplo no jsfiddle.

É óbvio que a solução postada pelo @rray é de longe mais simples e recomenda, porém há aqueles caso em que não é possível substituir o Plugin de Mascara da aplicação por N motivos, ai o jeito e improvisar igual eu fiz kkkk...

Essa solução server também para campos de CEP onde o usuário pode informar um Código postal brasileiro ou americano, usando uma lógica similar...

PS: Um plugin de mascara que recomendo e passei a utilizar é o Mask Plugin criado pelo Brasileiro @igorescobar (Github), ele reuni o Mask Input e Mask Money em um só com mais opções de personalização, vale a pena conferir!

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 .