javascript - 表格无法验证

我的表单无法验证，当我使用“提交”按钮调用我的所有函数时

//This is the main function
function validate_form(form) {
    var complete = false;

    //  Ensure that only one error message is diaplayed at a time
    if (complete) {
        clear_all();
        complete = checkUsernameForLength(form.username.value);

    }
    if (complete) {
        clear_all();
        complete = checkaddress(form.address.value);
    }
    if (complete) {
        clear_all();
        complete = checkaddress(form.address.value);
    }

    if (complete) {
        clear_all();
        complete = checkphone(form.phone.value);
    }
    if (complete) {
        clear_all();
        complete = checkEmail(email.phone.value);
    }

}

//Clear all red areas


function clear_all() {

    document.getElementById('usernamehint').style.visibility = 'hidden';
    document.basicform.username.style.backgroundColor = 'white';
    document.getElementById("countryhint").style.visibility = 'hidden';
    document.basicform.country.style.backgroundColor = 'white';
    document.getElementById("").style.visibility = 'hidden';
    document.basicformm.address.style.backgroundColor = 'white';
    document.getElementById("").style.visibility = 'hidden';
    document.basicform.phone.style.backgroundColor = 'white';
    document.getElementById("").style.visibility = 'hidden';
    document.basicform.email.style.backgroundColor = 'white';

}

// This function checks if the username field
// is at least 6 characters long.
// If so, it attaches class="welldone" to the
// containing fieldset.


function checkUsernameForLength(whatYouTyped) {
    var fieldset = whatYouTyped.parentNode;
    var txt = whatYouTyped.value;
    if (txt.length > 2) {
        fieldset.className = "welldone";
        return true;
    } else {
        fieldset.className = "";
        return false;
    }
}




// This function checks the email address to be sure
// it follows a certain pattern:
// If so, it assigns class="welldone" to the containing
// fieldset.

function checkEmail(whatYouTyped) {
    var fieldset = whatYouTyped.parentNode;
    var txt = whatYouTyped.value;
    if (/^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(txt)) {
        fieldset.className = "welldone";
    } else {
        fieldset.className = "";
    }
}

// If the address is at least 4 characters long, the containing
// fieldset is assigned class="kindagood".

function checkaddress(whatYouTyped) {
    var fieldset = whatYouTyped.parentNode;
    var txt = whatYouTyped.value;
    if (txt.length > 3 && txt.length < 10) {
        fieldset.className = "welldone";
    } else {
        fieldset.className = "";
    }
}



function checkphone(whatYouTyped) {
    var fieldset = whatYouTyped.parentNode;
    var txt = whatYouTyped.value;
    if (/^((\+\d{1,3}(-| )?\(?\d\)?(-| )?\d{1,5})|(\(?\d{2,6}\)?))(-| )?(\d{3,4})(-| )?(\d{4})(( x| ext)\d{1,5}){0,1}$/.test(txt)) {
        fieldset.className = "welldone";
    } else {
        fieldset.className = "";
    }
}

// this part is for the form field hints to display
// only on the condition that the text input has focus.
// otherwise, it stays hidden.

function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function () {
            oldonload();
            func();
        }
    }
}


function prepareInputsForHints() {
    var inputs = document.getElementsByTagName("input");
    for (var i = 0; i < inputs.length; i++) {
        inputs[i].onfocus = function () {
            this.parentNode.getElementsByTagName("span")[0].style.display = "inline";

        }

        inputs[i].onblur = function () {
            this.parentNode.getElementsByTagName("span")[0].style.display = "none";
        }
    }
}
addLoadEvent(prepareInputsForHints);

这是我的表格：

   <form action="#" name="basicform"  id="basicform"  onsubmit="return validate_form()" method="post" >

                                    <fieldset>
                                        <label for="username">Name:</label>
                                        <input type="text"id="username" onkeyup="checkUsernameForLength(this);" />
                                      <span class="hint" id="usernamehint">This Field Must Not Be Left Blank !</span>
                                    </fieldset>

                                     <fieldset>
                                        <label for="country">Country:</label>
                                        <input
                                            type="text"
                                            id="country"
                                            onkeyup="checkaddress(this);" />
                                        <span class="hint" id="countryhint">This Field Must Not Be Left Blank !</span>
                                    </fieldset>


                 <fieldset>
                    <label for="Subject">Subject:</label>
                    <input
                        type="text"
                        id="country"
                        onkeyup="checkaddress(this);" />
                    <span class="hint">Please Indicate What Your Interest Is !</span>
                </fieldset>



                 <fieldset>
                    <label for="Phone">Phone:</label>
                    <input
                        type="text"
                        id="Phone"
                        onkeyup="checkphone(this);" />
                    <span class="hint">This Feld Must Be Numeric Values Only !</span>
                </fieldset>

                <fieldset>
                    <label for="email">Email Address:</label>
                    <input
                        type="text"
                        id="email"
                        onkeyup="checkEmail(this);" />
                    <span class="hint">You can enter your real address without worry - we don't spam!</span>
                </fieldset>


                            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input value="send" class="gray" type="button" onclick="validate_form(this.form)"/>
                  <br /><br /> <br /><br />
                </form>

这是它的链接http://jsfiddle.net/j5fMq/

最佳答案

问题是validate_form（）开始于

var complete = false;

然后方法中的所有其他块都以

if (complete) {...

由于complete以false开头，因此这些块都不会运行！

关于javascript - 表格无法验证，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/5730122/