JavaScript验证不起作用（onSubmit）

Question

Vaidation function called on submit.

HTML

 <input type="submit" class="submit"  value="submit">

JS

window.load = function() {
var form = document.getElementById('form');
  form.onsubmit = function(e) {
      return validate(); // will be false if the form is invalid
  }  
}

Validate()

function validate() {

    var x = document.forms["form"]["fname"].value;
    var y = document.forms["form"]["pname"].value;
    var email = document.forms["form"]["email"].value;
    var phone = document.forms["form"]["phone"].value;
    var date = document.forms["form"]["date"].value;
    var month = document.forms["form"]["month"].value;
    var year = document.forms["form"]["year"].value;
    return false;
    alert('wass');



    if (x==null || x == "" || isNaN(x) == false) {
        alert("Check Name, It can't have numbers. You can use Roman numbers.");
        return false;}
    else if (y == null || y == "") {
        alert("Picture Name must be filled out");
        return false;       
    }
    else if(email == '' || email.indexOf('@') == -1 || email.indexOf('.') == -1) 
    {
        alert("Insert valid Email Address");
        return false;   
        }
    else if(phone == ''|| phone <1000000000 || phone >9999999999){

        alert("Enter valid phone number");
        return false;   

        }else if(date =='' || date<01 || date >31){

        alert("Enter valid Date ");
        return false;   

        }else if(month =='' || month<1 || month >12){

        alert("Enter valid Month ");
        return false;   

        }else if(year =='' || year<1800 || year >2016){
        alert("Enter valid Year ");
        return false;   

        }



//Function used to make colors red instead of individual codelines
function makeRed(inputDiv){
inputDiv.style.backgroundColor="#AA0000";
//inputDiv.parentNode.style.backgroundColor="#AA0000";
//inputDiv.parentNode.style.color="#FFFFFF";
}

//Function made to clean the divs when the validation is met.
function makeClean(inputDiv){
inputDiv.style.backgroundColor="#FFFFFF";
inputDiv.parentNode.style.backgroundColor="#FFFFFF";
inputDiv.parentNode.style.color="#000000";  
}



}

Form still gets submitted. Possible issues?

Answer 1

You'll need to prevent the default form submission using:

e.preventDefault();

Place this above your validate function.

Then use the submit() function on the form to actually submit the form provided your validation passes.

At the minute your form is submitting regardless.

Answer 2

You need to prevent default functionality of form submit, by calling e.preventDefault() . In your case:

window.load = function () {
    document.getElementById('form').onsubmit = function (e) {
        if (!validate()) {
            e.preventDefault();
        }
    }
}