问答详情
源自：8-5 计时器setTimeout()

表单元素点击事件改到script标签中就不能执行？？

<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
var num=0;
// numCount();
function numCount(){
 document.getElementById('txt').value=num;
 num=num+1;
 setTimeout("numCount()",1000);
 }
</script>
</head>
<body>
<form>
<input type="text" id="txt" />
<input type="button" value="Start" onclick="numCount()" />
</form>
</body>
</html>

为什么我把onclick="numCount()"删除，然后在script标签中加上numCount()就报错，

提示cannot set property 'value' of null


提问者：临风流烟 2016-11-02 00:40

个回答

  • stone310
    2016-11-02 08:20:41
    已采纳

    因为页面加载顺序从上到下，当执行numCount函数，加载到document.getElementById('txt').value=num这一句时，body里面的代码还未获取，因此会报错，只要将整个<script>标签放到</body>上方即可，

    <!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<form>
<input type="text" id="txt" />
<input type="button" value="Start"  />   <!--删除了onclick="numCount()"-->
</form>
<script type="text/javascript">
var num=0;
 numCount();                            //页面加载时立刻执行numCount()
function numCount(){
 document.getElementById('txt').value=num;
 num=num+1;
 setTimeout("numCount()",1000);
 }
</script>
</body>
</html>


    0