Проверка адреса электронной почты JS/JQuery

Я пытаюсь проверить адрес электронной почты при нажатии кнопки отправки электронной почты.Проверка адреса электронной почты JS/JQuery

Я пробовал добавить подтверждение JQuery безрезультатно. Мне было интересно, как я могу добавить оператор «if», который будет просто проверять и информировать пользователя, что он не является допустимым адресом электронной почты на том же ярлыке, который указывает, что он отправляет электронное письмо.

$('#Submit').on("click", function() { 
 
    result = '<label style="color:white;">Sending message ...</label>'; 
 
    $("#sendSuccess").html(result); 
 

 
    var email = $("#email").val(); 
 
    var body = "From: " + name + "<br /> Email: " + email + "<br /> Message: " + message; 
 

 
    $.ajax({ 
 
    type: "POST", 
 
    contentType: "application/json; charset=utf-8", 
 
    url: "EmailService.asmx/SendMail", 
 
    data: '{ body: "' + body + '", subject: "' + subject + '"}', 
 
    dataType: "json", 
 
    async: true, 
 

 
    success: function (data, status, xhr) { 
 
     //alert('success'); 
 
     result = '<label style="color:green;">The message has been sent!</label>'; 
 
     $("#sendSuccess").html(result); 
 
    }, 
 
    error: function (data, status, xhr) { 
 
     //alert('fail'); 
 
     result = '<label style="color:red;">The message has failed to send!</label>'; 
 
     $("#sendSuccess").html(result); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<html> 
 
    <div> 
 
    <input id="email" type="text" name="email" class="form-control" /> 
 
    </div> 
 
    <div> 
 
    <button type="submit" id="Submit" class="form-control">Click</button> 
 
     </div> 
 
    </html>

источник

2016-08-31 Steven

В начале функции проверяйте электронную почту, используя регулярное выражение для электронных писем (об этом Google). Если проверка прошла успешно, перейдите к остальной функции. В противном случае установите нужную метку и выйдите из функции. –

Также рекомендуется включить в поле «

Обратите внимание, что вам также нужно будет сделать 'event.preventDefault()', если вы использовали вышеописанное. Может быть, легче оставить его так, как оно есть на данный момент. –

Вы можете сделать что-то вроде этого:

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

<script> 
    function isValidEmail(email) { 
     return /^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-][email protected][a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/i.test(email); 
    } 

    $('#Submit').on("click", function() { 
     var email = $('#email').val(); 

     if (isValidEmail(email)) { 
      result = '<label style="color:white;">Sending message ...</label>'; 
      $("#sendSuccess").html(result); 

      var body = "From: " + name + "<br /> Email: " + email + "<br /> Message: " + message; 

      $.ajax({ 
       type: "POST", 
       contentType: "application/json; charset=utf-8", 
       url: "EmailService.asmx/SendMail", 
       data: '{ body: "' + body + '", subject: "' + subject + '"}', 
       dataType: "json", 
       async: true, 

       success: function (data, status, xhr) { 
        //alert('success'); 
        result = '<label style="color:green;">The message has been sent!</label>'; 
        $("#sendSuccess").html(result); 
       }, 
       error: function (data, status, xhr) { 
        //alert('fail'); 
        result = '<label style="color:red;">The message has failed to send!</label>'; 
        $("#sendSuccess").html(result); 
       } 
      }); 


     } else { 
      $('#sendSuccess').html('<label style="color:white;">Please enter a valid email address</label>'); 
     } 
    }); 
<script/>

Имейте в виду, что это будет проверять большинство писем, но может отклонить некоторые действительно странные адреса электронной почты, которые являются технически обоснованными. Вы можете прочитать больше here, а также в комментариях StackOverflow answer.

Если вам нужно проверить еще несколько полей, возможно, стоит дать еще один снимок проверки jQuery ... использовал его раньше и определенно помогает, если вы выполняете много общего подтверждения формы.

источник

2016-08-31 07:55:06

Проверка адреса электронной почты JS/JQuery

ответ

Смежные вопросы