因此,我有2个函数,一个是异步函数,基本上是一个HTTP Post Request,另一个是表单验证。我希望仅在表单验证功能返回true时才触发POST请求功能。表单验证如下所示:
regForm.addEventListener('submit', function(event){
if (checkInputs()) {
// trigger post request function
}
})
function checkInputs() {
const usernameValue = form.username.value.trim();
const passwordValue = form.password.value.trim();
const emailValue = form.email.value.trim();
if (usernameValue === '') {
// trigger another function that handles errors
setError(form.username, 'Can\'t be blank');
} else {
// triggers function that handles success(color change, etc.)
setSuccess(form.username);
}
if (passwordValue=== '') {
// trigger another function that handles errors
setError(form.password, 'Can\'t be blank');
} else {
// triggers function that handles success(color change, etc.)
setSuccess(form.password);
}
}
但是这似乎不起作用,它不会触发POST请求功能。
它会触发,因为您没有从checkInputs函数返回任何内容。
您需要返回布尔值/ true或false /。
类似:
function checkInputs() {
const usernameValue = form.username.value.trim();
const passwordValue = form.password.value.trim();
const emailValue = form.email.value.trim();
if (usernameValue === '') {
// trigger another function that handles errors
setError(form.username, 'Can\'t be blank');
return false;
} else {
// triggers function that handles success(color change, etc.)
setSuccess(form.username);
}
if (passwordValue=== '') {
// trigger another function that handles errors
setError(form.password, 'Can\'t be blank');
return false;
} else {
// triggers function that handles success(color change, etc.)
setSuccess(form.password);
}
return true;
}
在内部函数checkInputs()中,创建一个变量let check = true
,在每个if语句中为该变量分配false:
if (usernameValue === '') {
setError()
check = false;
}
return check;
在函数末尾。