老师 能解释下这个 怎么就可以清楚定时器?

来源:1-21 编程练习

Rain_2020

2019-12-06 17:07:42

var settimeFn;  

老师 能解释下这个 怎么就可以清楚定时器?



<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>定时器</title>

    <style type="text/css">

        div{width:400px;height:120px;margin-top:50px;border:2px solid gray;padding:10px;}

    </style>

</head>

<body>

    <input type="button" value="删除">

    <input type="button" value="取消删除">

    <div>点击"删除"按钮后,里面的内容将在3秒钟后消失;<br/><br/>如点击了"删除"后又不想删除内容,请在点击"删除"按钮3秒之内点击"取消删除"按钮即可</div>

    <script type="text/javascript">

       //补充代码

       var input1 = document.getElementsByTagName("input");

       var divs = document.getElementsByTagName("div")[0];

       var settimeFn; 

       input1[0].onclick = function(){

settimeFn = setTimeout(function(){

divs.innerText = "";

},3000)

       }

       input1[1].onclick = function(){

       clearTimeout(settimeFn);

       }

    </script>

</body>

</html>


写回答

2回答

好帮手慕码

2019-12-07

同学你好,如果在input1[0].onclick中,如下声明定时器:

http://img.mukewang.com/climg/5deb03800924962a04810259.jpg

那么settimeFn就是局部变量,只在input1[0].onclick的作用域中生效。在input1[1].onclick是无法访问的。

像同学之前的写法:

http://img.mukewang.com/climg/5deb03e309d73ae206030285.jpg

settimeFn是一个全局变量,在input1[0].onclick和input1[1].onclick中都可以访问,因此能实现效果。

如果我的回答帮到了你,欢迎采纳,祝学习愉快~

2

好帮手慕码

2019-12-06

同学你好,代码是正确的。针对你的问题如下解答:

真正清除定时器的是如下代码:

http://img.mukewang.com/climg/5dea1f4e09f193f004730131.jpg

(clearTimeout() 方法可取消由 setTimeout() 方法设置的 timeout)settimeFn就是通过setTimeout方法设置的定时器。

如果我的回答帮到了你,欢迎采纳,祝学习愉快~

0
hain_2020
h 我是想知道 为什么 直接声明变量 跟 全局变量 在这里直接声明变量就不可以调用清除? var settimeFn = setTimeout(function(){divs.innerText = "";},3000)
h019-12-06
共1条回复

0 学习 · 40143 问题

查看课程