JavaScript - 验证用户输入

Question

我有一个网页应该接收用户的联系信息并对其进行验证，但是我的脚本似乎没有运行，我不知道为什么。

我知道您可以使用 document.getElementById(name).value 获取文本字段的输入，这就是我所拥有的，但我的 submit 按钮没有任何响应。

有什么建议吗？

HTML：

<form>
    First Name:<br>
        <input type="text" id="first" name="firstname"><br>
    Last Name:<br>
        <input type="text" id="last" name="lastname"><br>
    Street Address:<br>
        <input type="text" id="addr" name="address"><br>
    City:<br>
        <input type="text" id="city" name="city"><br>
    State:<br>
        <input type="text" id="state" name="state"><br>
    Zip Code:<br>
        <input type="text" id="zip" name="zip"><br>
    Phone #:<br>
        <input type="text" id="phone" name="phone"><br>
    E-mail Address:<br>
        <input type="text" id="email" name="email"><br>
    <br>
    <button type="button" onclick="verify()">Submit</button>
</form>

JavaScript：

function verify() {
    var fname, lname, addr, city, state, zip, phone, email;
    var alpha = /[A-z]/i;

    fname = document.getElementById('first').value;
    lname = document.getElementById('last').value;
    addr = documnet.getElementById('addr').value;
    city = document.getElementById('city').value;
    state = document.getElementById('state').value;
    zip = document.getElementById('zip').value;
    phone = document.getElementById('phone').value;
    email = document.getElementById('email').value;

    var values = [fname, lname, addr, city, state, zip, phone, email];

    window.alert(fname);

    /*
    //Check to see if any fields are blank
    for(var i = 0; i < values.length; i++) {
        if(values[i] == "") {
            window.alert("Must have a value in each field");
            return false;
        }
    }

    //Check to see if text fields contain non-alphabetic characters
    if(!alpha.test(fname)) {
        window.alert("First name must contain only alphabetic characters");
        return false;
    }
    if(!alpha.test(lname)) {
        window.alert("Last name must contain only alphabetic characters");
        return false;
    }
    if(!alpha.test(city)) {
        window.alert("City must contain only alphabetic characters");
        return false;
    }
    if(!alpha.test(state)) {
        window.alert("State must contain only alphabetic characters");
        return false;
    }
    */
}

Answer 1

你有错别字

addr = documnet.getElementById('addr').value;

应该是

addr = document.getElementById('addr').value;

注意document

的拼写

除此之外，您的代码似乎运行良好。请参阅fiddle