0

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

这是我的提交按钮。

<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;
    }
}
4

1 回答 1

2

我想你想要：

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

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

更新

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

function validateRegistrationForm() {
    var valid = true;
    valid = validateUsername() && valid;
    valid = validatePassword() && valid;
    valid = validateConfirmPassword() && valid;
    return valid;
}
于 2013-04-18T23:23:26.103 回答