Como todos já sabem está pra acontecer a mudança no meio do ano onde os números de telefone de São Paulo vão ganhar um digito a mais resumindo fu… nossos sites que possuem cadastro de telefone… brincadeira…
Então vamos lá eu atualmente utilizo o MaskedInput do JQuery e utilizo a seguinte máscara:
$("#telefone").mask("(99) 9999-9999");
Porém ele inclui a máscara MAS… se eu aumentar um digito nessa máscara ele considera todos obrigatórios e no meu formulário vai poder entrar tanto telefones de 8 digitos como telefone de 9 digitos eu gostaria q 1 UM digito apenas não fosse obrigatório.
E ai vcs já estão arrumando seus formulários já fizeram algo do tipo?
Estava procurando um local para discutir esse assunto, e parece que aqui é o ideal.
Tenho que fazer a correção para diversos sites que gerencio, e a solução apresentada também me veio a mente de imediato. O problema é que sou chato (hehehe) e ao pesquisar descobri que o padrão de formato adotado pela Anatel é (99) 99999-9999 e não (99) 9999-99999 (prefixo vai ficar com 5 dígitos). Parece bobeira mas… é para isso que usamos a máscara, para seguir o padrão pré-estabelecido.
Ainda não tenho a resposta, mas estou rascunhando… assim que tiver algo concreto posto aqui.
$("[alt=phone]").live('keypress', function (event) {
var target, phone, element;
target = (event.currentTarget) ? event.currentTarget : event.srcElement;
phone = target.value.replace(/\D/g, '');
element = $(target);
element.unsetMask();
if (phone.length > 5 && phone.substr(0,3) == "119") { //ele só vai colocar no formato de SP quando for ddd 11 e iniciar com 9.
element.setMask("(99) 99999-9999");
} else {
element.setMask("(99) 9999-9999");
}
})
;
Danilo, gostei da sua solução, mas como o prefixo dos celulares de S. Paulo vai de 6###.#### a 9###.####, e não apenas 9###.####, alterei um pouco o seu código para acomodar todos eles:
$("[alt=phone]").live('keypress', function (event) {
var target, phone, element;
target = (event.currentTarget) ? event.currentTarget : event.srcElement;
phone = target.value.replace(/\D/g, '');
element = $(target);
element.unsetMask();
if (phone.length > 5 && phone.substr(0,3) > "115" && phone.substr(0,3) <= "119") { //ele só vai colocar no formato de SP quando for ddd 11 e iniciar entre 6 e 9.
element.setMask("(99) 999-999-999");
} else {
element.setMask("(99) 9999-9999");
}
})
Foi uma mão na roda, obrigado.
[quote=Danilo MR]Resolvi assim para o caso do jquery meio mask.
$("[alt=phone]").live('keypress', function (event) {
var target, phone, element;
target = (event.currentTarget) ? event.currentTarget : event.srcElement;
phone = target.value.replace(/\D/g, '');
element = $(target);
element.unsetMask();
if (phone.length > 5 && phone.substr(0,3) == "119") { //ele só vai colocar no formato de SP quando for ddd 11 e iniciar com 9.
element.setMask("(99) 99999-9999");
} else {
element.setMask("(99) 9999-9999");
}
})
;[/quote]
O motivo do setTimeout é pq, do contrário, não temos acesso ao texto atualizado, somente o texto antigo (1 caractere a menos). O motivo do keydown em vez de keypress é pq keypress não pega backspace.
O único defeito que eu encontrei foi quando a pessoa está com 11 dígitos e apaga mais de um caractere de uma vez. Aí ele só vai atualizar a máscara quando chegar no décimo dígito.
[]s!
[code]$(function() {
$(’#telefone1’)
.mask("(99) 9999-9999?9")
.keydown(function() {
var $elem = $(this);
var tamanhoAnterior = this.value.replace(/\D/g, ‘’).length;
setTimeout(function() {
var novoTamanho = $elem.val().replace(/\D/g, '').length;
if (novoTamanho !== tamanhoAnterior) {
if (novoTamanho === 11) {
$elem.unmask();
$elem.mask("(99) 99999-9999");
} else if (novoTamanho === 10) {
$elem.unmask();
$elem.mask("(99) 9999-9999?9");
}
}
}, 1);
});
