在javascript验证后发布表单



我已经阻止了HTML表单通过提交,所以我可以用JavaScript进行表单验证。我的表单验证工作,但我不知道如何通过提交表单。我如何递交表格?我想使用POST方法来路由'/login'。

const form = document.getElementById('login');
const email = document.getElementById('email');
const password = document.getElementById('password');
const regexEmail = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,6}$/;
form.addEventListener('submit', (e) => {
e.preventDefault();

if(checkInputs()) {
alert('test');
}
});
/* Validate input from form */
function checkInputs() {
let emailSuccess = false;
let passwordSuccess = false;
if(!validateInput(regexEmail, email.value.trim())) {
setErrorFor(email, "Invalid email");
emailSuccess = false;
}
else {
setSuccessFor(email);
emailSuccess = true;
}
if(password.value.length < 6) {
setErrorFor(password, "Password should be 6 characters or more");
passwordSuccess = false;    
}
else {
setSuccessFor(password);
passwordSuccess = true;
}
return (passwordSuccess && emailSuccess);  
}
/* Display error message and error icon */
function setErrorFor(input, message) {
const formControl = input.parentElement;
const error = formControl.querySelector('.error-message');
error.className = 'error-message error';
error.innerText = message;
formControl.className = 'form-control error'; 
}
/* Display success icon and remove any error message */
function setSuccessFor(input) {
const formControl = input.parentElement;
const error = formControl.querySelector('.error-message');
error.className = 'error-message';
formControl.className = 'form-control success';
}
/* Validate user input - regexpression match */
function validateInput(regex, input) {
return regex.test(input);
}

e.preventDefault();阻止表单提交,您总是这样做。

只有在验证失败时才这样做。

if (!checkInputs())

你可以使用。submit()方法。

简单:

$("#myForm").submit();

没有jQuery:

document.getElementById("#myForm").submit();

最新更新