jQuery-检查是否填写了某些字段，然后验证电子邮件

只是尝试使用jQuery将两个函数拼凑在一起。在表单上提交时，代码会检查是否填写了所有字段，如果所有字段都正确，则会转到另一个函数，在该函数中检查电子邮件验证

我想我很接近，当我按下submit时，验证警报会显示一毫秒，然后它会提交（我不希望这样做，因为使用的电子邮件无效）。我确信它的代码足够简单，因此我远离任何表单验证

代码如下：

<script type="text/javascript"> 
    $("#test").submit(function(){
        $(".error").hide();

        var isFormValid = true;

        $(".required").each(function(){
            if ($.trim($(this).val()).length == 0){
                $(this).addClass("highlight");
                isFormValid = false;
            }
            else{
                $(this).removeClass("highlight");
            }
        });
        if (!isFormValid) { 
            document.getElementById("error").innerHTML = "You must fill in all of the fields.";
            return isFormValid;
        }
        else {
            myFunction();
        }
    });

    function myFunction() {
        var isEmailValid = true;

        var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
        var emailaddressVal = $("#email").val();

        if (!emailReg.test(emailaddressVal)) {
            $("#email").after('<span class="error">Enter a valid email address.</span>');
            isEmailValid = false;
        }
        else {
            ///ajax post function here///
        }

        if(!isEmailValid) {
            document.getElementById("error").innerHTML = "Please enter a valid email address.";
            return isEmailValid;
        }
    }
</script>

$（“#测试”）.submit（函数（）{
$（“.error”）.hide（）；
var isFormValid=true；
$（“.required”）。每个（函数（）{
if（$.trim（$（this.val（））.length==0）{
$（此）.addClass（“突出显示”）；
isFormValid=false；
}
否则{
$（此）.removeClass（“突出显示”）；
}
});
如果（！isFormValid）{
document.getElementById（“错误”）.innerHTML=“必须填写所有字段。”；
返回是有效的；
}
否则{
myFunction（）；
}
});
函数myFunction（）{
var isEmailValid=true；
var emailReg=/^（[\w-\.]+@（[\w-]+\.）+[\w-]{2,4}）？$/；
var emailaddressVal=$（“#email”）.val（）；
如果（！emailReg.test（emailaddressVal））{
$（“#电子邮件”）。之后（'输入有效的电子邮件地址'）；
isEmailValid=false；
}
否则{
///这里有ajax post函数///
}
如果（！isEmailValid）{
document.getElementById（“错误”）.innerHTML=“请输入有效的电子邮件地址。”；
返回有效期；
}
}

试试这个：

<script type="text/javascript"> 
$("#test").submit(function(){
    $(".error").hide();

    var isFormValid = true;

    $(".required").each(function(){
        if ($.trim($(this).val()).length == 0){
            $(this).addClass("highlight");
            isFormValid = false;
        }
        else{
            $(this).removeClass("highlight");
        }
    });
    if (!isFormValid) { 
        document.getElementById("error").innerHTML = "You must fill in all of the fields.";
        return isFormValid;
    }
    else {
        return myFunction();//should return true or false
    }
});

function myFunction() {
    var isEmailValid = true;

    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
    var emailaddressVal = $("#email").val();

    if (!emailReg.test(emailaddressVal)) {
        $("#email").after('<span class="error">Enter a valid email address.</span>');
        isEmailValid = false;
    }
    else {
        ///ajax post function here///
    }

    if(!isEmailValid) {
        document.getElementById("error").innerHTML = "Please enter a valid email address.";
        return isEmailValid;
    }
    return isEmailValid;//should return true or false
}
</script>

$（“#测试”）.submit（函数（）{
$（“.error”）.hide（）；
var isFormValid=true；
$（“.required”）。每个（函数（）{
if（$.trim（$（this.val（））.length==0）{
$（此）.addClass（“突出显示”）；
isFormValid=false；
}
否则{
$（此）.removeClass（“突出显示”）；
}
});
如果（！isFormValid）{
document.getElementById（“错误”）.innerHTML=“必须填写所有字段。”；
返回是有效的；
}
否则{
return myFunction（）；//应返回true或false
}
});
函数myFunction（）{
var isEmailValid=true；
var emailReg=/^（[\w-\.]+@（[\w-]+\.）+[\w-]{2,4}）？$/；
var emailaddressVal=$（“#email”）.val（）；
如果（！emailReg.test（emailaddressVal））{
$（“#电子邮件”）。之后（'输入有效的电子邮件地址'）；
isEmailValid=false；
}
否则{
///这里有ajax post函数///
}
如果（！isEmailValid）{
document.getElementById（“错误”）.innerHTML=“请输入有效的电子邮件地址。”；
返回有效期；
}
return isEmailValid；//应返回true或false
}

在

else

块中对

myFunction（）的调用前面放置一个
return
时会发生什么？