老师为什么我点击多次后,速度越来越快?
// 页面延时加载 window.onload = function () { // 存储数值 var text = "<span>hello</span>"; // 获取容器 var div = document.getElementsByTagName('div')[0]; // 获取按钮 var btn = document.getElementById('btn'); // 按钮绑定事件 btn.onclick = function () { // 间隙调用定时器 setInterval(function () { // 每次在原来基础上追加 后面新加入的。 div.innerHTML += text + ' '; },500) } }
1
收起
正在回答 回答被采纳积分+1
3回答
qq_一切都是最好的安排_1
2019-05-21 10:12:49
哥们就是说:
你点击一下就生成第一个计时器 timer1
你点击两下就生成第二个计时器 timer2
你点击三下就生成第三个计时器 timer3
说白了就是3个计时器在运行,也就是说有三个函数前后同时在页面打印,页面显示就会越来越快。
为了让页面正常显示,不管我们点击几次,要保证只有一个计时器在运行。那么页面就可以正常显示了。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <textarea name="" id="text" cols="30" rows="30"></textarea> <input type="button" id="btn" value="点击"> <script> var timer=null;//计时器对象 var text=document.getElementById('text');//获取文本域对象 document.getElementById('btn').onclick=function(){//点击按钮开始执行函数 if(timer){//计时器存在 return;//如果计时器存在,则代码不往下执行。让已经存在的计时器继续执行 }else{//如果计时器不存在,则开始执行文本域操作 timer = setInterval(function(){ text.value+="abcd "; },1000) } } </script> </body> </html>
你可以看下我代码的注释,很好理解的,加油!!!望采纳!!!!!!
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星