使用 jquery 验证电子邮件 ID

Validation for email id using jquery

本文关键字：ID 电子邮件 验证 jquery 使用      更新时间：2023-09-26

我正在尝试使用jquery验证电子邮件ID。当按下无效的特殊字符（该字符不会在电子邮件中使用）时，将显示无效的电子邮件 ID。如果有效
可以继续填写其他详细信息

这是代码。

   $("#emailid").bind("keypress", function (event) {
    if (event.charCode != 0) {
        var filter = /^([a-zA-Z0-9_'.'-])+'@(([a-zA-Z0-9'-])+'.)+([a-zA-Z0-9]{2,4})+$/;
        var key = String.fromCharCode(!event.charCode ? event.which : event.charCode);
        if (!filter.test(emailid)) {
           alert('Please enter a valid email address');
           event.preventDefault();
           return false;
        }
    }
  });

.HTML：

<div>
 <label>Email Id </label>
 <input type="text" name="emailid" id="emailid"  style="width: 300px;border:solid 1px #0096ce;"/>
</div>

在此代码中，如果我们键入字母或任何字符，它会显示错误消息。请告诉我代码有什么问题

我用来在模糊中检查电子邮件的替代方案，您可以尝试一下： 

$("#emailid").on("blur", function (event) {
   var str = $(this).val();
   var filter = /^([a-zA-Z0-9_'.'-])+'@(([a-zA-Z0-9'-])+'.)+([a-zA-Z0-9]{2,4})+$/;
   if (!filter.test(str)) {
      alert('Please enter a valid email address');
      return false;
   }
});

演示

试试这个。 

<input type="email" class="email"/>
<div id="message"></div>
<script>
$('.email').on('keyup', function(){
    var valid = /^(['w-'.]+@(['w-]+'.)+['w-]{2,4})?$/.test(this.value) && this.value.length;
    $('#message').html('It''s'+ (valid?'':' not') +' valid');
});
</script>

演示

http://jsfiddle.net/o7t8991c/

如果您确实想要显示警报，可以执行以下操作： 

function isvalidEmail(email) {
  var regex = /^([a-zA-Z0-9_.+-])+'@(([a-zA-Z0-9-])+'.)+([a-zA-Z0-9]{2,4})+$/;
  return regex.test(email);
}

$("#emailid").keyup(function (event) {
  var emailValue = $(this).val();
  console.log(emailValue);
  if(!isvalidEmail(emailValue)){
    alert('Please enter a valid email address');
  }
});

JS小提琴链接：

http://jsfiddle.net/w0yoaqs5/

使用 Jquery 和对无效电子邮件的警报，DEMO

    <h4>
    <br />Email <span>*</span>
    </h4>                       
    <input type="text" id="Email" name="Email" maxLength="50" size="45" />
$("#Email").blur(function() 
{
 var emailReg = /^(['w-'.]+@(['w-]+'.)+['w-]{2,4})?$/;  
 var emailaddress = $("#Email").val();
 if(!emailReg.test(emailaddress)) 
 {
        alert('Please enter valid Email address!');  
        return false;
 }
});

或者使用javascript函数正则表达式可能是方法。示例（演示）：

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(email);
}

注意：但请记住，不应仅依赖 JavaScript 验证。JavaScript可以很容易地被禁用。这也应该在服务器端进行验证。

您可以将type="text"更改为"type="email"。在这种情况下，你不需要使用 jQuery。:)

相关文章：