Mascara campo de telefone em javascript com regex – Nono dígito – Telefones São Paulo
Boas!
Fiz uma rápida adaptação da expressão regular, usada na função mtel(). Que eu já havia postado aqui:
http://wbruno.com.br/2011/03/12/diversas-mascaras-com-er/
Aumentei o maxlenght de 14 para 15.
<html>
<head>
<title>Mascara Telefone</title>
<script type="text/javascript" src="mtel.js"></script>
</head>
<body>
<input type="text" name="telefone" onkeyup="mascara( this, mtel );" maxlength="15" />
</body>
</html>
E o mtel.js
/* 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;
}
Alterei a segunda expressão regular, para funcionar de forma invertida. De trás para frente.
Contar os 4 últimos dígitos finais, e colocar o hífen antes deles. Deixando assim, o DD quatro ou cinco dígitos, depois o hífen, e os próximos quatro dígitos.
Usou ? gostou ?
Comente!!
— update —
Apenas para alertar que a forma acima, não é a melhor maneira de implementar.
Devemos separar as camadas, e deixar a chamada do script do lado do js. Dessa forma aqui:
<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').onkeyup = function(){
mascara( this, mtel );
}
}
</script>
</head>
<body>
<input type="text" name="telefone" id="telefone" maxlength="15" />
</body>
</html>