Как сделать проверку на символ @ в jQuery

Question

Записываю так, но не работает:

 if (!email.contains("@")) {
   $(".error3").addClass('invalid');
   $(".error3").html("Имя почты некорректно");
   $(".error3").css({'color': 'red'});

Answer 1

То, что вы хотите, можно сделать так:

$("#email").on("input",function(){
  var email = $(this).val();
  if (!email.includes("@")){ // Проверка
     $(".error3").addClass('invalid');
     $(".error3").html("Имя почты некорректно");
     $(".error3").css({'color': 'red'});
     $(".error3").show();
  } else {
     $(".error3").hide();
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="email" />
<div class="error3"></div>

Однако лучше воспользоваться регулярным выражением:

$("#email").on("input",function(){
  var email = $(this).val();
  if (!validateEmail(email)){// Проверка
     $(".validate").addClass('invalid').removeClass("valid");
     $(".validate").html("Имя почты некорректно");
  } else {
     $(".validate").addClass('valid').removeClass("invalid");
     $(".validate").html("Имя почты корректно");
  }
})

function validateEmail(email) {
    var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    return re.test(String(email).toLowerCase());
}

.valid {
  color: green;
}

.invalid {
  color: red;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input id="email" />
<div class="validate"></div>

Так же можно посмотреть в сторону <input type="email" />

БЛОГ НА HUSL

Как сделать проверку на символ @ в jQuery

Ответы (1 шт):