Validação de Campo Email em Formulário com JavaScript

Validação de Campo Email em Formulário com JavaScript

Segue abaixo um código em JavaScript para validação do campo Email em formulários.

Código do formulário:

<form id="form1" name="form1" method="post" action="#" onsubmit="return valida_form(this)">
<label for="email"></label>
<input name="email" type="text" id="email" size="35" />
</form>

Criando a função:

<script type="text/javascript" language="javascript">
function valida_form (){
    var filter = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
    if(!filter.test(document.getElementById("email").value)){
        alert('Por favor, digite o email corretamente');
        document.getElementById("email").focus();
        return false;
    }
}
</script>

Outra forma de verificar se o Email foi digitado corretamente:

O exemplo a seguir valida um endereço de Email, verificando se o texto contém um símbolo “@” e pelo menos um ponto. O “@” não pode ser o primeiro caractere, e o último ponto deve vir após o “@”.

/*função valida email*/
function valida_form()
{
    var x=document.forms["myForm"]["email"].value;
    var atpos=x.indexOf("@");
    var dotpos=x.lastIndexOf(".");
    if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
    {
        alert("Não é um endereço de e-mail válido");
        return false;
    }
    return true;
}

Conclusão

Verificar se um campo está vazio em um formulário é uma técnica essencial para garantir a qualidade dos dados enviados pelos usuários. Usando JavaScript para validação, podemos evitar erros simples e melhorar a experiência do usuário. Ao aplicar essa técnica, podemos garantir que os campos importantes, como o campo de e-mail, estejam preenchidos corretamente antes de enviar os dados. É um exemplo simples e prático de como implementar validações eficazes em formulários, um tema que é fundamental para qualquer desenvolvedor de sistemas.

Fabio Bmed

Olá! Sou Fábio, fundador da Metapax — especializada em marketing e soluções digitais para clínicas e profissionais de psicologia — e criador do blog FabioBmed.

Desde 2006 trabalho com tecnologia e marketing digital. Mas os sistemas que mais me fascinam hoje são os que carregamos dentro da cabeça.

Estou entrando na psicologia, com foco em neuropsicologia — a ciência que explica por que você pensa, decide e se comporta do jeito que faz. Essa transição não é um desvio de rota: é a evolução natural de quem passou anos entendendo como sistemas funcionam — e percebeu que o mais complexo de todos ainda estava por ser mapeado.

Aqui, tudo — marketing, tecnologia, comportamento, decisões — é lido pelo mesmo prisma: a psicologia e a ciência por trás de como a mente humana realmente funciona.

www.fabiobmed.com.br