昨天遇到了验证码发送,发出来给新人借鉴一下,觉得有用的话点个赞哦 首先body中给按钮加一个id方便取用
<input type="button" value="发送验证码" onclick="getCode()">
js中:
//设置一个发送验证码的冷却时间 let cd = 0; //用来保存当前计时器编号 let timerId = 0; //发送验证码的按钮 let bt = $("[value='发送验证码']"); //保存css设定的颜色 let bgColor = bt.css("background-color") // alert(bgColor) function getCode() { if(cd===0) { //cd为0,向服务器发一送请求(已省略!!!) //然后将cd改为60(一分钟内不能再次发送) cd = 60 //设置一个计时器,每1000毫秒执行一次设置冷却时间的函数 timerId = setInterval(setTime, 1000) //设置计时器后弹出一下它的编号(不必要) // alert(timerId) //修改按钮背景色 bt.css("background-color","#ccc") }else{ alert("请在"+cd+"秒后重试") } } function setTime() { //冷却时间未结束 if(cd>0){ //冷却时间减一秒 cd -- //将按钮的文字修改(在后面附带剩余冷却时间秒数) bt.val("发送验证码("+cd+")") }else{ //冷却时间为0,清除当前计时器 clearTimeout(timerId) //恢复按钮显示文字 bt.val("发送验证码") //恢复按钮背景色 bt.css("background-color",bgColor) } }