setTimeout()
用于在指定的毫秒数后调用函数或计算表达式,只执行 code 一次。
setInterval()
可按照指定的周期(以毫秒计)来调用函数或计算表达式,不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。
由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
代码实现如下
HTML部分
<body>
<div class="wrap">
<input type="tel" class="shuru" id="phone"/>
<button class="btn" id="send">发送</button>
</div>
</body>
标题为JSFidder的链接,js部分代码如下
var wait=60;
function time(){
var btn=document.getElementById("send");
var str=btn.innerText;
if(wait==1){
btn.innerText="再次发送";
btn.removeAttribute("disabled");
wait=60;
}else{
wait--;
btn.innerText=wait+"s后重新获取";
btn.setAttribute("disabled",true);
setTimeout(function(){
time();
},1000);
}
}
//点击button触发
document.getElementById("send").onclick=time;
js部分代码如下
<script type="text/javascript">
function time(){
var wait=60;
var btn=document.getElementById("send");
btn.setAttribute("disabled",true);
var timer=setInterval(function(){
if(wait==1){
btn.innerText="再次发送";
btn.removeAttribute("disabled");
wait=60;
clearInterval(timer);
}else{
wait--;
btn.innerText=wait+"s后重新获取";
}
},1000)
}
document.getElementById("send").onclick=time;
</script>