Javascript错误检查错误。 （表格确认）

Question

我正在尝试验证表单中的多个字段。在大多数情况下，我的代码似乎有效，但经过进一步测试，我发现了一些奇怪的行为。无论出于何种原因，如果最后一个字段正在工作，我的表单似乎会通过，在这种情况下，将忽略所有其他错误检查。同样在旁注上我的消息似乎没有更新，在错误提交后，再次提交不同的错误。 有人可以向我解释为什么会这样吗？

这是我的提交按钮。

<button type="submit" onclick="return validateRegistrationForm()" >
    Register
</button>

脚本：

function validateRegistrationForm()
{
    return validateUsername(), validatePassword(), validateConfirmPassword();
}

function validateUsername()
{
    var x=document.forms["registration"]["userName"].value;if (x == null || x == "")
    {
        document.getElementById("usernameWarnings").innerHTML = "Username is Required!";
        return false;
    }
    else if (x.length < 6 || x.lenth > 10)
    {
        document.getElementById("usernameWarnings").innerHTML = "Must be Between 6 to 10 Characters!";
        return false;
    }
    else
    {
        return true;
    }
}

function validatePassword()
{
    var y=document.forms["registration"]["userPassword"].value;
    if (y == null || y == "")
    {
        document.getElementById("passwordWarnings").innerHTML = "Password is Required!";
        return false;
    }
    else if (y.length < 6 || y.lenth > 10)
    {
        document.getElementById("passwordWarnings").innerHTML = "Must be Between 6 to 10 Characters!";
        return false;
    }
    else
    {
        return true;
    }
}
function validateConfirmPassword()
{
    var y=document.forms["registration"]["userPassword"].value;
    var k=document.forms["registration"]["cUserPassword"].value;
    if (k == null || k == "")
    {
        document.getElementById("confirmPasswordWarnings").innerHTML = "Confirm Password is Required!";
        return false;
    }
    else if (y != k)
    {
        document.getElementById("confirmPasswordWarnings").innerHTML = "Passwords not the same";
        return false;
    }
    else
    {
        return true;
    }
}

Answer 1

我想你想要：

return validateUsername() && validatePassword() && validateConfirmPassword();

&&是确保满足所有条件所必需的。

更新

并非所有错误消息都显示，因为javascript会使&&运算符“短路”。这意味着如果&&的左侧评估为false，则右侧甚至不会运行（因为此时操作的输出保证为false） 。以下是确保它们全部执行的方法：

function validateRegistrationForm() {
    var valid = true;
    valid = validateUsername() && valid;
    valid = validatePassword() && valid;
    valid = validateConfirmPassword() && valid;
    return valid;
}