JavaScript定时器的使用

最新推荐文章于 2024-07-10 14:03:37 发布

前端人，前端魂

最新推荐文章于 2024-07-10 14:03:37 发布

阅读量71

点赞数

分类专栏： JavaScript入门文章标签： js javascript html

本文链接：https://blog.csdn.net/weixin_46468143/article/details/109732952

版权

JavaScript入门专栏收录该内容

8 篇文章 0 订阅

订阅专栏

JavaScript定时器的使用
定时器开 setinterval（函数名，时间/毫秒）
关闭定时器 clearInterval(定时器名字）
案例点击发送短信

<!DOCTYPE html>
<html lang="en">
<head>   
 <meta charset="UTF-8">    <meta name="viewport" content="width=device-width, initial-scale=1.0">    
<title>点击发送短信</title>
<script>
	window.onload=function () {
	//获取按钮
	var btn = document.getElementById("btn");
	//给一个定时器的名称
	var timer = null;
	//给倒计时一个值 5 秒
	var count = 5；
	//点击按钮事件
	btn.onclick=function(){
		//开启定时器
	timer=setInterval(fn, 1000);
	var that = this//把btn对象给that
	function fn(){
	//判断count值
	if(count >=0){
	than.disabled = true;//倒计时的时候不能点击button
	count--;//让秒数倒数减少
	that.innerHTML = "剩下"+count+"秒"//让btn显示剩下多少秒
	}else{
		than.disabled = false;//用户可以点击重新发送
		that.innerHTML = "重新发送短信"//让btn可以重新发送
		clearInterval(timer)
		count = 5;
		}
		}
	}
	}
</script>
 </head>
<body>
<input type = "text">
<button id = "btn"> 点击发送短信</button>
</body>
</html>

好了能力有限只能讲这么多了小白勿喷做的不好

前端人，前端魂

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript定时器的使用

JavaScript定时器的使用定时器开 setinterval（函数名，时间/毫秒）关闭定时器 clearInterval(定时器名字）案例点击发送短信<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
复制链接

扫一扫