《JavaScript》BOM 发送短信案例

最新推荐文章于 2025-08-10 19:50:19 发布

glglgl1

最新推荐文章于 2025-08-10 19:50:19 发布

阅读量1.2k

点赞数

CC 4.0 BY-SA版权

文章标签： javascript 开发语言

本文链接：https://blog.csdn.net/glglgl1/article/details/123928907

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		手机号码：<input type="number"> <button>发送1</button>
		<script>
	
		var btn = document.querySelector('button');
		var time = 10;
		btn.addEventListener('click', function()
		{
			btn.disabled = true;
			var timer = setInterval(function()
			{
				if(time == 0)
				 {
					 
					 clearInterval(timer);
					 btn.disabled = false;
					 btn.innerHTML = '发送1';
				 }
				 else
				 {
					 btn.innerHTML = '还剩下'+ time + '秒';
					 time--;
				 }
			},1000);
		})
		</script>
	</body>
</html>

按钮点击后会禁用disabled 为true
同时按钮里面的内容会发生变化，注意button 里面的内容通过 innerhtml修改
里面秒数是有变化的因此需要用到定时器

如果本来变量为0 说明到了时间我们需要停止定时器并且复原按钮初始状态

清除定时器和复原按钮
clearInterval