1.目标获取验证码后,按钮显示重新发送倒计时,倒计时结束后按钮重新可用。本文主要和大家分享js实现短信验证码倒计时实例,希望能帮助到大家。
2.用到的两个关键api
每秒执行:setInterval
指定时间结束后执行:setTimeout
3.代码
<span style="font-size: 14px;">function createTimer(time,interval,timeout){<br/><br/> let hasStartTime = 0//已经走了的时间<br/> interval(hasStartTime)//立即执行一次<br/> let _interval = setInterval(()=>{<br/> hasStartTime = hasStartTime+1000<br/> interval(hasStartTime)<br/> }, 1000)<br/> setTimeout(()=>{<br/> clearInterval(_interval)<br/> timeout()<br/> }, time || 60000)<br/>}<br/></span>其中time为设定的总时间,interval为每秒执行的操作,timeout为时间结束后执行的操作。记住倒计时结束后要将每秒执行的操作取消掉。
调用者只要自己传入每秒要刷新的内容。比如
<span style="font-size: 14px;">let time = 10000<br/>createTimer(time,timeStart=>{<br/> let btn_text = `重新发送(${(time- timeStart)/1000}s)`<br/> let btn_lock = true<br/> },()=>{<br/> let btn_text = `重新发送`,<br/> let btn_lock = false<br/> })<br/></span>相关推荐:










