电子邮件验证Jquery不起作用

Email validation Jquery not working

本文关键字:不起作用 Jquery 验证 电子邮件      更新时间:2023-09-26

我一直在做一个简单的电子邮件验证。但它不起作用。

有什么想法为什么它不起作用吗?我是做错了什么,还是应该用其他方式构建代码?

我做了一个类似的功能:

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

然后我在CCD_ 1函数中调用该函数。

我的JS是这样的:

function doOutputMessage(type, message){
    $("#outputMessage").html("");
    $("#outputMessage").removeClass();
    $("#outputMessage").hide();
    if(type == "error") {
        $("#outputMessage").addClass("error").fadeIn("fast");
    } else if(type == "success") {
        $("#outputMessage").addClass("success").fadeIn("fast");
    }
    $("#outputMessage").text(message);
    $("#outputMessage").show();
}
function setupRegistration(){
    $("#signupWrapper").on("click", "#regUser", function(){
        var username = $("input[name='username']").val();
        var email = $("input[type='email']").val();
        var password = $("input[type='password']").val();
        if(username == ""){
            doOutputMessage("error", "Fill in your desired username!");
        }
        if(email == ""){
            doOutputMessage("error", "Fill in your email!");
        }
        if(IsEmail(email)==false){
            doOutputMessage("error", "mailen är fel förfan");
        }
        if(password == ""){
            doOutputMessage("error", "Fill in your desired password!");
        }
        if(username != "" && email != "" && password != ""){
            ajaxCall(username, email, password);
        }   
    });
}
function IsEmail(email) {
    var regex = /^([a-zA-Z0-9_'.'-'+])+'@(([a-zA-Z0-9'-])+'.)+([a-zA-Z0-9]{2,4})+$/;
    if(!regex.test(email)) {
       return false;
    }else{
       return true;
    }
}

function ajaxCall(username, email, password){
    $.ajax({
        type: 'POST',
        url: '../register.php',
        data:   {
            'username' : username,
            'email' : email,
            'password' : password,
        },
        success: function(data) {
            if(data.exists){
                doOutputMessage("error","That Username is allready taken.");
            } else if(data.inserted) {
               doOutputMessage("success","You have successfully been registered!");
            }else {
                doOutputMessage("error","Something went wrong, try again later.");
            }
        }
    });
}
$(document).ready(function(){
    setupRegistration();
});

function regSubmit(){
    clearErrorMessages();
    var username = $("#regForm #username").val();
    var email = $("#regForm #email").val();
    var password = $("#regForm #password").val();
    if(username == ""){
        showValidationMessage("#regForm #error_username", "Fill in your desired username!");
    }
    if(email == ""){
        showValidationMessage("#regForm #error_email", "Fill in your email!");
    }
    if(password == ""){
        showValidationMessage("#regForm #error_password", "Fill in your desired password!");
    }
    if(username != "" && email != "" && password != ""){
        $.ajax({
            url:    'regLogin.code.php',
            type:   'POST',
            data:   {
                    'action'    :   'register',
                    'username'  :   username,
                    'email'     :   email,
                    'password'  :   password
                    },
            success: function(data, status){
                console.log(data);
                if(data == "exist"){
                    showValidationMessage("#regForm  #error_general", "A user with that username or password already exists!");
                }else if(data == "illegal"){
                    showValidationMessage("#regForm  #error_general", "Your username contains illegal characters!");
                }
                else if(data == "true"){
                    showValidationMessage("#regForm  #success", "Success!");
                    setTimeout(function(){
                        window.location.replace("/admin/inside/");
                    }, 1000);
                }
            },
            error: function(xhr, desc, err){
                showValidationMessage("#regForm  #error_general", "Something went wrong, please try again");
            }
        });
    }
}

@Mario Chueca是对的。您的代码基本上工作正常,但是,无论电子邮件是否正确,您都在进行Ajax调用,因此不会显示错误消息。您应该只在指定的电子邮件有效时进行ajax调用:

if(username != "" && email != "" && password != "" && IsEmail(email)){
    ajaxCall(username, email, password);
}  

我在下面包含了一个代码示例,以表明您的电子邮件验证(没有Ajax调用)是有效的。我已经包含了@Abdulla建议的if(!IsEmail(email){修复,我还添加了一个更复杂的正则表达式。

function IsEmail(email) {
  //var regex = /^([a-zA-Z0-9_'.'-'+])+'@(([a-zA-Z0-9'-])+'.)+([a-zA-Z0-9]{2,4})+$/;
  //More advanced regex to valid 99.99% of most emails in use, see https://stackoverflow.com/questions/46155/validate-email-address-in-javascript
  var regex = /^[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:'.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?'.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/;
  if (!regex.test(email)) {
    return false;
  } else {
    return true;
  }
}
function doOutputMessage(type, message) {  
  $("#outputMessage").html("");
  $("#outputMessage").removeClass();
  $("#outputMessage").hide();
  if (type == "error") {
    $("#outputMessage").addClass("error").fadeIn("fast");
  } else if (type == "success") {
    $("#outputMessage").addClass("success").fadeIn("fast");
  }
  $("#outputMessage").text(message);
  $("#outputMessage").show();
}
//if (IsEmail('john.doe@stackoverflow.com')) {
//  doOutputMessage('success', 'valid email')
//}
if (!IsEmail('john.doe#stackoverflow.com')) {
  doOutputMessage('error', 'invalid email')
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="outputMessage">Test</div>

使用以前的一些建议,但也更改了这一点,错误不会停止ajax调用:

var error_email=false;
if(!IsEmail(email)){
    error_email=true;
    doOutputMessage("error", "mailen är fel förfan");
}
if(password == ""){
    doOutputMessage("error", "Fill in your desired password!");
}
if(username != "" && email != "" && password != "" && !error_email){
    ajaxCall(username, email, password);
} 

删除此处中的false

if(!IsEmail(email){

并且CCD_ 4应该是

regex = /^(['w-]+(?:'.['w-]+)*)@((?:['w-]+'.)*'w['w-]{0,66})'.([a-z]{2,6}(?:'.[a-z]{2})?)$/i;

现场演示

如何查找或验证电子邮件地址

请尝试:

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