将我的"check if valid email"函数包含在我的 AJAX 中

Question

所以现在我有了成功的代码。但我想做的是将其包含在我的AJAX中。这就是我的AJAX：

function checkEmail() {
// var myForm = $("#mainForm").serialize();
var fname = $("#first").val();
var lname = $("#second").val();
var email = $("#email").val();
var password = $("#password").val();
var repass = $("#en").val();
if (fname && lname && email && password && repass && password.length >= 6 && password == repass)) {
jQuery.ajax({
url: "connection.php",
data: {
fname:fname,
lname:lname,
email:email,
password:password,
repass:repass
},
type: "POST",
success:function(data){
$("#emailExists").show();
$("#email").css("border","2px solid green");
$("#no").css("visibility","hidden");
$("#yes").css("visibility","visible");
if(data){
$("#email").css("border", "2px solid red");
$("#no").css("visibility","visible");
$("#yes").css("visibility","hidden");
}else
{
$("#email").css("border", "2px solid green");
$("#no").css("visibility","hidden");
$("#yes").css("visibility","visible");
window.location.href = 'home.php';
}
$("#emailExists").html(data);
},
error:function (){
}
});
}
}

所以，我想做的，基本上是，在if语句[if(name&&lname…)]中。在那个特定的部分，我想包括这个特定的检查电子邮件是否有效的系统。所以我在想，也许可以把这个代码(检查电子邮件是否有效的if语句)做成一个函数，然后把它添加到AJAX中，这样：

if (fname && lname && email && password && repass && password.length >= 6 && password == repass && checkValidateEmail()) {

但如果我在一个名为checkValiateEmail()的函数中保留if语句并这样做，它就不起作用了。我该怎么办？

我的Javascript用于检查电子邮件是否有效：

if(email.value === "") {
no.style.visibility = 'visible';
yes.style.visibility = 'hidden';
email.style.border = '2px solid red';
mailText.style.visibility = 'visible';
mailText.innerText = "Please enter an email address.";
validEmail.style.visibility = 'hidden';
} else if (!validateEmail(email.value)) {
no.style.visibility = 'visible';
yes.style.visibility = 'hidden';
email.style.border = '2px solid red';
mailText.style.visibility = 'hidden';
validEmail.style.visibility = 'visible';
} else {
yes.style.visibility = 'visible';
no.style.visibility = 'hidden';
email.style.border = '2px solid green';
mailText.style.visibility = 'hidden';
validEmail.style.visibility = 'hidden';
}

validateEmail()函数：

function validateEmail(email) {
const 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);
}

Answer 1

validateEmail(email)只有一个参数(应该验证的电子邮件)，但您没有在if.中传递任何参数

if (fname && lname && email && password && repass && password.length >= 6 && password == repass && checkValidateEmail()) {
//                                                                                                                    ↑
//                                                         HERE the `email` is missing ───────────────────────────────┘

你的支票必须是

if ( /* ... */ validateEmail(email) ){
// ...
}

否则就没有什么可以检查的了。(嗯，undefined会被检查是否是有效的电子邮件，但当然不是)。

Answer 2

function validateEmail(email) {
const 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);
}
if(email.value === "") {
no.style.visibility = 'visible';
yes.style.visibility = 'hidden';
email.style.border = '2px solid red';
mailText.style.visibility = 'visible';
mailText.innerText = "Please enter an email address.";
validEmail.style.visibility = 'hidden';
} else if (!validateEmail(email.value)) {
no.style.visibility = 'visible';
yes.style.visibility = 'hidden';
email.style.border = '2px solid red';
mailText.style.visibility = 'hidden';
validEmail.style.visibility = 'visible';
} else {
yes.style.visibility = 'visible';
no.style.visibility = 'hidden';
email.style.border = '2px solid green';
mailText.style.visibility = 'hidden';
validEmail.style.visibility = 'hidden';
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input style="margin-left:-10px; width:505px; font-family:inherit; margin-top:11px" class="mail" type="text" id="email" name = "email" placeholder="Email Address">
<i style="color: green; margin-top:28px; margin-left:-38px; position:absolute; visibility: hidden" class="fa fa-check-circle" id="yes"></i>
<i style="color: red; margin-top:28px; margin-left:-38px; position:absolute; visibility: hidden" class="fa fa-exclamation-circle" id="no"></i>
<small style="margin-top:56px; position: fixed; margin-left: -498px; font-size: 14px; color:red; visibility: hidden" id="mailText"></small>
<span style="margin-top:56px; position: fixed; margin-left: -498px; font-size: 14px; color: red; display:none" id="emailExists" name="emailExists" class="emailExists">Email address already taken.</span>
<small style="margin-top:56px; position: fixed; margin-left: -498px; font-size: 14px; color:red; visibility:hidden" id="validEmail">Please enter a valid email address.</small>

<input style="margin-left:-10px; width:505px; font-family:inherit; margin-top:11px" class="mail" type="text" id="email" name = "email" placeholder="Email Address">
<i style="color: green; margin-top:28px; margin-left:-38px; position:absolute; visibility: hidden" class="fa fa-check-circle" id="yes"></i>
<i style="color: red; margin-top:28px; margin-left:-38px; position:absolute; visibility: hidden" class="fa fa-exclamation-circle" id="no"></i>
<small style="margin-top:56px; position: fixed; margin-left: -498px; font-size: 14px; color:red; visibility: hidden" id="mailText"></small>
<span style="margin-top:56px; position: fixed; margin-left: -498px; font-size: 14px; color: red; display:none" id="emailExists" name="emailExists" class="emailExists">Email address already taken.</span>
<small style="margin-top:56px; position: fixed; margin-left: -498px; font-size: 14px; color:red; visibility:hidden" id="validEmail">Please enter a valid email address.</small>

<script type="text/javascript">  

function validateEmail(email) {
const 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);
}
if(email.value === "") {
no.style.visibility = 'visible';
yes.style.visibility = 'hidden';
email.style.border = '2px solid red';
mailText.style.visibility = 'visible';
mailText.innerText = "Please enter an email address.";
validEmail.style.visibility = 'hidden';
} else if (!validateEmail(email.value)) {
no.style.visibility = 'visible';
yes.style.visibility = 'hidden';
email.style.border = '2px solid red';
mailText.style.visibility = 'hidden';
validEmail.style.visibility = 'visible';
} else {
yes.style.visibility = 'visible';
no.style.visibility = 'hidden';
email.style.border = '2px solid green';
mailText.style.visibility = 'hidden';
validEmail.style.visibility = 'hidden';
}

<script>