Estoy tratando de enmascarar el teléfono usando el ejemplo en este enlace , pero sin éxito. Lo que quiero hacer es eliminar los paréntesis y reordenar.
Regla: el primer carácter siempre es 5. En forma de 3 3 2 2, ejemplo: 532 123 45 67
const $input = document.querySelector('[data-js="input"]') $input.addEventListener('input', handleInput, false) function handleInput (e) { e.target.value = phoneMask(e.target.value) } function phoneMask (phone) { return phone.replace(/\D/g, '') .replace(/^(\d)/, '($1') .replace(/^(\(\d{3})(\d)/, '$1) $2') .replace(/(\d{3})(\d)/, "$1-$2") .replace(/(-\d{4})\d+?$/, '$1'); }Lo siento por informar mal los bloques en la primera publicación. No se debe permitir la entrada de nuevos personajes al finalizar.
Los bloques serán los siguientes: 3 3 2 2 / Ejemplo: 532 123 45 67
Regex puede ser complicado, pero me encanta lo bueno que es el resultado :)
function phoneMask (phone) { return phone.replace(/\D/g, '') .replace(/(^[^5])/, '') .replace(/(\d{3})(\d)/, '$1 $2') .replace(/(\d{3}\s\d{3})(\d{1,2})/, '$1 $2') .replace(/(\d{3}\s\d{3}\s\d{2})(\d{1,2})/, '$1 $2') .replace(/(\d{3}\s\d{3}\s\d{2}\s\d{2})\d+?$/, '$1') }Pasos explicados:
.replace(/\D/g, '').replace(/(^[^5])/, '').replace(/(\d{3})(\d)/, '$1 $2').replace(/(\d{3}\s\d{3})(\d{1,2})/, '$1 $2').replace(/(\d{3}\s\d{3}\s\d{2})(\d{1,2})/, '$1 $2').replace(/(\d{3}\s\d{3}\s\d{2}\s\d{2})\d+?$/, '$1')Hay una manera más fácil :
1- Eliminar cualquier carácter que no sea un número
2- Formatea los números como "3 4 2 2" (o de cualquier otra forma)
phone = '+ (123) 45678901'; phone = phone.replace(/[^0-9]+/gim, ''); phone = phone.replace(/^([0-9]{3})([0-9]{4})([0-9]{2})([0-9]{2})$/, '$1 $2 $3 $4');