表单验证字段

Question

好吧我有电子邮件和密码字段。 他们的验证设置。 对于密码字段，如果确认密码不好，它会告诉您与电子邮件格式相同。

但是，当我点击注册它将验证表单是否字段是正确的或不正确的。

<div class="form-group"> 
     <input class="btn btn-success" type="submit" name="submit_reg" value="Register" > 
     </div> 

有人知道如何解决这个问题吗？ 这是我的代码的一部分 https://jsfiddle.net/tk2nqbo9/1/

Answer 1

您的验证，虽然它可能正确显示错误，但决不会阻止提交表单。如果您想在发生错误时阻止提交，则需要将表单提交添加一个事件侦听器。

你的听众可能会是这个样子：

document.querySelector('form').addEventListener('submit', function(event) { 
    if (!passwordCheck()) { 
     reportError("Password error"); 
     event.preventDefault(); //Stops the submission of the form 
    } 

    if (!emailCheck()) { 
     reportError("Email error"); 
     event.preventDefault(); 
    } 

    //Got here? All good, don't do anything. 
}); 

您还可能有兴趣在pattern attribute。至少，它可以取代你的email_validate函数。