老师为什么我点击多次后,速度越来越快?
// 页面延时加载
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 星