post #6301
Código JS para Formatar Telefone/Celular no Formulário do Elementor
Publicado em: 02/06/2025 / Atualizado em: 02/06/2025
Segue abaixo código JavaScript simples para adicionar em seu site WordPress com Elementor, para formatar o campo de telefone, para seguir o padrão de formatação (XX) 9XXXX-XXXX para celular ou (XX) XXXX-XXXX para telefone fixo. Segue código abaixo:
<script>
document.addEventListener('DOMContentLoaded', function () {
const phoneInputs = document.querySelectorAll('input[type="tel"], input[name*="form_fields[telefone]"]');
phoneInputs.forEach(function (input) {
input.addEventListener('input', function (e) {
let value = e.target.value.replace(/\D/g, '');
if (value.length > 11) value = value.slice(0, 11);
if (value.length >= 2) {
let ddd = value.slice(0, 2);
let rest = value.slice(2);
if (rest.length > 5) {
let firstPart = rest.slice(0, rest.length - 4);
let secondPart = rest.slice(-4);
e.target.value = `(${ddd}) ${firstPart}-${secondPart}`;
} else if (rest.length > 0) {
e.target.value = `(${ddd}) ${rest}`;
} else {
e.target.value = `(${ddd}`;
}
} else {
e.target.value = value;
}
});
});
});
</script>Lembrando que para enviar o campo telefone com essa formatação, precisa deixar o campo como tipo texto, somente assim o Elementor permite que você envie caracteres especiais junto com os números do telefone.
Publicações recomendadas:
Link Direto
Compartilhe esse conteudo nas redes sociais ou por mensagem usando o link direto abaixo. Basta copiar.
bruno.art.br/?p=6301
ID de Referência: 6301
Sugira uma publicação
Envie uma mensagem e sugira um publicação sobre um assunto que tenha dificuldades de resolver.