JAVASCRIPT - 遗漏的类型错误:无法读取空

问题描述:

<!DOCTYPE html> 

<html> 
<head> 
    <meta charset="utf-8"> 
     <title>Javascript Form Testing</title> 
</head> 

<body> 
Name: <input type="text" name="Name" value="Name" id="fname"> <br> 
Email: <input type="text" name="Email" value="Email" id="mail" > <br> 
Phone: <input type="text" name="Number" value="Phone Number" id="dvr" onchange="validatePhone();"> 
<span id="phoneval"> ?</span> 

    <script type="text/javascript"> 
    phonenum = document.getElementById("dvr").value.length; 
     function validatePhone() { 
      if (phonenum == 10){ 
       document.getElementById('phoneval').innerhtml="<-- Valid"; 
      } 
      else{ 
       document.getElementById('phoneval').innerhtml="<-- Not Valid"; 
      } 
     } 
    </script> 
</body> 
</html> 

喜的特性“值”,我得到了错误“遗漏的类型错误:无法读取属性‘’空的”当标签是在头值,但因为我移动它,它就消失了。但是,现在它输出没有错误,并没有什么。请帮忙?JAVASCRIPT - 遗漏的类型错误:无法读取空

对不起任何格式和事物,新:/

+0

我不想提交答案,因为我实际上在工作atm。首先最重要的是没有什么是调用validatePhone()..如果你只是希望它在dom被加载后运行(但是在资源被加载之前),那么你可以把调用放在'validatePhone()'之前 但是,您可能想要在表单提交事件期间运行所有这些操作 – 2012-08-13 04:32:48

+0

Javascript对于大小写敏感,应该是'innerHTML' – diEcho 2012-08-13 04:35:36

编辑:

稍有不同的实现,它的工作原理:http://jsfiddle.net/SfTR2/确保JS是在HTML加载后,或使用window.onload

原来的答复:

您需要在验证功能中获取长度:

function validatePhone() { 
     var phonenum = document.getElementById("dvr").value.length; //MOVE IT HERE 
     if (phonenum == 10){ 
      document.getElementById('phoneval').innerHTML="<-- Valid"; 
     } 
     else{ 
      document.getElementById('phoneval').innerHTML="<-- Not Valid"; 
     } 
    } 

如前所述,您正在缓存空的长度。

此外,正如@su提到的,您需要使用innerHTML

+1

如果我们在函数外面指定'var phonenum'会怎么样。我认为这样也行。 – diEcho 2012-08-13 04:36:56

+0

是的,只要你得到函数内的长度(和值)。 – 2012-08-13 04:37:46

+0

如果我们在函数之外定义了一些变量,那么它的范围将是**全局**,并且可以在任何函数中使用。看到[demo](http://jsfiddle.net/KsW8E/) – diEcho 2012-08-13 04:42:13

添加

validatePhone(); 

到脚本的末尾(您定义的功能,但从来不叫的话)。和innerHTML的改变innerHTML的

+0

不要忘记phonenum的赋值超出了函数的范围。 – ChaosPandion 2012-08-13 04:33:28

+0

好的,这似乎在一定程度上起作用,但它没有更新变化? (或模糊,或其他) – 2012-08-13 04:40:56

+0

为了使onchange工作,您需要移动var phonenum = document.getElementById(“dvr”).value.length;到验证电话功能(如亚当希思的答案),以便它获得电话号码的更新值。 – 2012-08-13 04:45:20