表单验证无效

Question

我有一个简单的登录,我无法让验证工作.我想知道是否有人可以提供帮助.

HTML:

<div class="login">
        <h2>Sign In</h2>

        <form id="frmLogin" method="post">

            Username: <input id="txtUsername" name="txtUsername" type="text" /><br/>
            Password: <input name="txtPassword" type="password" /> <br/>
            <button onClick="validateLogin()">Log In</button>
        </form>
    </div><!-- End of Login Section -->

使用Javascript:

<script>
function validateLogin()
{
    var userName = document.getElementsByID('txtUsername').value;

    var invalidForm = 0;

    if(userName == "")
    {
        alert("Username cannot be blank!");
        invalidForm = 1;                
    }//end if

    if(invalidForm == 0)
    {
        alert("Form validated, no errors");
    }//end if 

}
</script>

目前我正在测试一个空的用户名,一旦我能够正常工作,我将继续其余的.谢谢!

Answer 1

要获取和ID元素的函数名getElementById,而不是getElementsByID,此外,JavaScript是区分大小写,因此getElementByID不能正常工作.

function validateLogin()
{
    var userName = document.getElementById('txtUsername').value;

    var invalidForm = 0;

    if(userName == "")
    {
        alert("Username cannot be blank!");
        invalidForm = 1;                
    }//end if

    if(invalidForm == 0)
    {
        alert("Form validated, no errors");
    }//end if 

}