5

我正在编写一个获取姓名、地址和电话号码的 html 页面来练习验证。当 javascript 函数尝试获取输入中值的长度时，我收到此错误：“未捕获的 TypeError：无法读取 null 的属性‘长度’”

我不知道 nodeValue 是什么意思，但我只是想获取输入中的值。

这是javascript中给我错误的代码部分：

function Validate(nameInput, lastNameInput, addressInput, phoneInput)
{

var errorSpan = document.getElementById("errorSpan");
var okSpan = document.getElementById("okSpan");

var nameErrSpan = document.getElementById("nameErrSpan");
var lastNameErrSpan = document.getElementById("lastNameErrSpan");
var addressErrSpan = document.getElementById("addressErrSpan");
var phoneErrSpan = document.getElementById("phoneErrSpan");

var nameLength = nameInput.nodeValue.length;
var lNameLength = lastNameInput.nodeValue.length;
var addressLength = addressIput.nodeValue.length;
var phoneLength = phoneInput.nodeValue.length;

我需要改变什么才能获得输入中的值并测量它们？

这是我的html代码：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Validation Form</title>
</head>
<body>

<div>
    <span>First name:</span><br />
    <input type="text" id="firstName" /> <span id="nameErrSpan" class="nHidden">Name Must Be Between 3 - 10 Letters</span>
    <br>


    <span>Last name:</span><br />
    <input type="text" id="lastName" /> <span id="lastNameErrSpan" class="lnHidden">Last Name Must Be Between 3 - 10 Letters</span>
    <br>

    <span>Address:</span><br />
    <input type="text" id="address" /> <span id="addressErrSpan" class="adHidden">Address Must Be Between 10 - 25 Letters</span>
    <br>

    <span>Phone number:</span><br />
    <input type="text" id="phoneNumber" /> <span id="phoneErrSpan" class="pHidden">Phone Must Be Between 3 - 10 Digits</span>
    <br>

    <button onclick="Validate(firstName, lastName, address, phoneNumber)">Check</button><br />

    <span id="errorSpan" class="hidden">Missing fields</span><br />
    <span id="okSpan" class="hidden">All fields are filled</span><br />

    <button onclick="reset()">Reset</button><br />


</div>

<link rel="stylesheet" href="registrationForm.css">
<script src="registrationForm.js"></script>
</body>
</html>
4

2 回答 2

2

要将文本输入input，您应该使用.value，而不是.nodeValue。

var nameLength = nameInput.value.length;
var lNameLength = lastNameInput.value.length;
var addressLength = addressIput.value.length;
var phoneLength = phoneInput.value.length;
于 2017-04-29T13:14:44.563 回答
0

元素的值input可从其value属性中获得。nodeValue是所有inputDOM 节点的属性，与元素无关。

于 2017-04-29T13:14:47.300 回答