Question

我正在尝试使用jquery验证emailid。当按下无效的特殊字符时，不会在电子邮件中使用警告消息，以显示无效的电子邮件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>

在此代码中，如果我们输入字母或任何字符，则会显示错误消息。请告诉我代码的错误

Answer 1

试试这个..

<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/

Answer 2

我已经习惯使用模糊检查电子邮件的替代方法，您可以尝试：

$("#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;
   }
});

<强> DEMO

Answer 3

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

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/

Answer 4

使用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;
 }
});

OR 使用javascript函数regular expressions可能就是这样。示例（ Demo ）：

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。这也应该在服务器端验证。

Answer 5

您可以将type="text"更改为`type =＆＃34; email＆＃34;＆＃39; 。在这种情况下，您不需要使用jQuery。：）

使用jquery验证电子邮件ID

5 个答案: