<input type="text" name="" id=""><button class="btn">发送短信</button>
<script>
// 点击发送按钮后 该按钮60秒内不能再次点击
var btn = document.querySelector(".btn");
var index = 60; // 初始化倒计时秒数
// 点击btn后让该按钮disable=true禁用
// 同时修改文字为:60秒后重新发送短信
btn.addEventListener("click",function(){
btn.disabled = true;
// 60秒需要每隔一秒递减 要用到定时器 且让index--
var timer = setInterval(function(){
// 如果秒数等于了0,按钮重新启用 并修改文字为发送 还需要清清除定时器 不然会一直循坏该函数
if(index === 0){
btn.disabled = false;
btn.innerHTML = "发送";
index = 5;
clearInterval(timer);
}else {
btn.innerHTML = ""+index+"秒后重新发送短信";
index--;
}
},1000)
})
</script>
BOM:倒计时60秒之后重新发送短信的小练习
最新推荐文章于 2022-11-24 20:47:18 发布