Máscara de telefone de 9 dígitos com DDD em JavaScript
Neste pequeno script, mostrarei como criar uma máscara para telefones com 9 dígitos e DDD como o que foi implantado em São Paulo e estará em breve no restante do país.
Para validação é utilizada algumas expressões regulares.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 |
<html> <head> <title>Mascara Telefone</title> <script type="text/javascript"> /* 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 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 id( el ){ return document.getElementById( el ); } window.onload = function(){ id('telefone').onkeypress = function(){ mascara( this, mtel ); } } </script> </head> <body> <input type="text" name="telefone" id="telefone" maxlength="15" /> </body> </html> |
Carregando...
Você pode se interessar
Artigos
29 visualizações
Artigos
29 visualizações
Como planejar e construir um projeto de programação
Carlos L. A. da Silva - 19 de abril de 2021O desenvolvedor full stack Peter Lynch revela seu método de preparação para qualquer projeto, de forma simples e direta para iniciantes e veteranos.
Artigos
164 visualizações
Artigos
164 visualizações
15 ferramentas de desenvolvimento para melhorar sua produtividade em 2021 sem gastar nada
Carlos L. A. da Silva - 2 de abril de 2021O cenário de desenvolvimento está em constante mudança e muitas vezes uma ferramenta nova pode agilizar muito seu trabalho.
Artigos
161 visualizações
Artigos
161 visualizações
A tecnologia por trás do deep fake de Deep Nostalgia
Carlos L. A. da Silva - 22 de março de 2021Serviço do My Heritage permite "animar" fotos do passado, trazendo vida para seus antepassados. Como isso é possível?
11 Responses
Deixe um Comentário
Mais publicações
Artigos
147 visualizações
147 visualizações
Notícias
164 visualizações
164 visualizações
Quanto ganha um programador? Confira uma das maiores pesquisas salariais realizadas no Brasil
Redação - 23 de fevereiro de 2021
Artigos
127 visualizações
127 visualizações
Artigos
144 visualizações
144 visualizações
Artigos
147 visualizações
147 visualizações
Como se tornar um Engenheiro DevOps em 2021
Carlos L. A. da Silva - 1 de março de 2021Notícias
164 visualizações
164 visualizações
Quanto ganha um programador? Confira uma das maiores pesquisas salariais realizadas no Brasil
Redação - 23 de fevereiro de 2021
Como planejar e construir um projeto de programação
19 de abril de 2021
A tecnologia por trás do deep fake de Deep Nostalgia
22 de março de 2021
A seguir. Somente números + DDD + tel 8 “OU” 9 dígitos + tratamento para “ç e Ç”
By: †‡Falcão‡†
js: Assinatura(NomeCampo)
function telefone(a) { $(a).keyup(function (f) { if ((f.keyCode > 64 && f.keyCode < 91) || f.keyCode == 186) { var d = (String.fromCharCode(f.keyCode)).toUpperCase(); var c = (a.value.charAt(a.value.length – 1)).toUpperCase(); if (d == c || c == "Ç" || c == "ç") { a.value = a.value.substring(0, (a.value.length – 1)) } } }); separador = "("; separador1 = ")"; separador2 = "-"; conjunto1 = 0; conjunto2 = 3; conjunto3 = 8; if (a.value.length 13) { a.value = a.value.replace(“-“, “”); a.value = a.value.substring(0, 9) + separador2 + a.value.substr(9, 4) } } } };
Olá Pessoal! testei este código o mesmo não deu certo, não funcionava a mascara de jeito nenhum.
Este código abaixo foi o que estou usando, esta funcionando blz serve tbm para os 9 digitos.
Mascara Telefone
/* 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 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 id( el ){
return document.getElementById( el );
}
window.onload = function(){
id(‘telefone’).onkeyup = function(){
mascara( this, mtel );
}
}
Ai pessoal este código postado realmente não funciona, mas eu dei Ctrl+U na página e copiei o código fonte do site em funcionamento e funcionou legal, este código postado esta com erro de formatação, faça isso pessoal…
Funcionou pra mim, o problema que eu tenho é o componente não tem todos os atributos que eu preciso, e ele não está funcionando no meu componente de que o nosso arquiteto criou, mas valeu pela força, já ajudou muito.
/* 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 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 id( el ){
return document.getElementById( el );
}
window.onload = function(){
id(‘telefone’).onkeypress = function(){
mascara( this, mtel );
}
}
pode pegar esse funciona
Este plugin também é uma opção interessante: https://github.com/masimao/maskbrphone
Olá, mas seu eu tiver 2 campos um para telefone e o outro para celular, os ids serão diferentes, como devo proceder nesse caso, porque desse jeito que está aí, um funciona o outro não.
Tem como atribuir ele a uma classe ao invés de uma id?
Valeu pela dica Jeovane Carvalho, ensinando usar Ctrl+U, Funcionou !
obrigado por compartilhar