validando email com regex em JavaScript e Jquery[RESOLVIDO]

1. validando email com regex em JavaScript e Jquery[RESOLVIDO]

César
dark777

(usa Debian)

Enviado em 05/10/2023 - 17:17h

Ola galera beleza?
Tenho a seguinte estrutura em um formulário:


<div class="mb-10">
<label for="email">
Email:
</label>

<input class="form-control" type="email" name="email" id="email">
</div>


estou tentando validar apenas uma determinada faixa de emails com a seguinte estritura Jquery abaixo:

$(document).ready(function() {

$('#email').on("input",
function() {
var email = $(this).val();
var regex = /^([a-z0-9._]+@(hotmail|terra|yahoo|uol|bol)\.com\.br|(gmail)\.com)$/;

if (!regex.test(email)) {
// O email não corresponde à regex, é inválido.
$(this).removeClass("valid").addClass("invalid");
} else {
// O email corresponde à regex, é válido.
$(this).removeClass("invalid").addClass("valid");
}
});
});


Mas se eu digito: usuario@teste.com ele esta validando como faço para validar somente os emails da regex e mostrar email invalido quando o usuario enviar o formulário?
Eu ja tentei validar usando o type="text" e mesmo assim nao consegui o que esta dando errado?
wiki.anon


  


2. Re: validando email com regex em JavaScript e Jquery[RESOLVIDO]

Alexa Bolada
alexabolada

(usa Debian)

Enviado em 05/10/2023 - 17:17h

Olá, wiki.anon!

Na verdade o seu código jQuery e regex estão corretos, eles irão validar corretamente os emails que correspondem ao padrão da regex. O que provavelmente está ocorrendo é um conflito com a validação nativa do HTML5 para o tipo de input "email".

Quando você define um input com o tipo "email", o HTML5 já faz uma validação básica de email que aceita qualquer email com formato válido, mesmo que não esteja na lista especificada na sua regex.

A solução para resolver o problema é mudar o tipo do input de "email" para "text". Você mencionou que já fez isso e não funcionou, então eu acredito que pode ter algum outro erro no seu código que está provocando o problema.

Veja como ficaria sua estrutura de formulário com o tipo "text" no campo de email:


<div class="mb-10">
<label for="email">
Email:
</label>

<input class="form-control" type="text" name="email" id="email">
</div>


E o seu código jQuery continua o mesmo.

Se, após essas alterações, o problema persistir, recomendo que você verifique se há algum outro script ou plugin em seu projeto que possa estar interferindo na validação do campo de email.

Es


3. Re: validando email com regex em JavaScript e Jquery

Marcelo Oliver
msoliver

(usa Debian)

Enviado em 06/10/2023 - 00:25h

Use o "input='text'", com a expressão regular correta que funciona..... Testado OK!
Dicas:
Mais simples com "JavaScript Puro",
use o pattern no input, e CSS para alterar o fundo qdo o email é inválido.


______________________________________________________________________
Att.: Marcelo Oliver
______________________________________________________________________






Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts