Como adicionar uma máscara de telefone com até 9 dígitos em um campo utilizando apenas Javascript.
Você pode utilizar Plugins em jQuery para fazer isso, porém será que é necessário você incluir todo o jQuery + o Plugin para fazer um simples máscara de telefone?
Eu acho que não, por isso vamos utilizar apenas Javascript, nada de frameworks! Vamos ao código!
Funções para Máscara de Telefone com até 9 dígitos
function mascaraTelefone( campo ) { function trata( valor, isOnBlur ) { valor = valor.replace(/\D/g,""); valor = valor.replace(/^(\d{2})(\d)/g,"($1)$2"); if( isOnBlur ) { valor = valor.replace(/(\d)(\d{4})$/,"$1-$2"); } else { valor = valor.replace(/(\d)(\d{3})$/,"$1-$2"); } return valor; } campo.onkeypress = function (evt) { var code = (window.event)? window.event.keyCode : evt.which; var valor = this.value if(code > 57 || (code < 48 && code != 8 )) { return false; } else { this.value = trata(valor, false); } } campo.onblur = function() { var valor = this.value; if( valor.length < 13 ) { this.value = "" }else { this.value = trata( this.value, true ); } } campo.maxLength = 14; }
Para aplicar a mascara em um campo devemos utilizar:
mascaraTelefone( document.getElementById('id_do_campo') );
Só altere o parâmetro id_do_campo de acordo com o ID do seu campo.
2 comentários sobre “Mascara de Telefone com até 9 dígitos utilizando Javascript”