倒计时获取验证码

Posted 2021-01-06 yubaibai

html：

<div>
<div >验证码</div>
<input id="identifying" type="text" placeholder="请输验证码" style="width: 36%; color: #999; border: none;" />
<a id="btn_code" href="javascript:send_code();" style="margin-left: 8px; line-height: 48px; color: #27D0F2;">获取验证码</a>
</div>

js:

//倒计时
var send_code_time = 60;

//倒计时

function code_countdown() {
send_code_time--;
$("#btn_code").text("等待(" + send_code_time + ")秒");
$("#btn_code").removeAttr("href");

if (send_code_time != 0) {
setTimeout(function () {
code_countdown();
}, 1000);
} else {
send_code_time = 60;
$("#btn_code").text("获取验收码");
$("#btn_code").attr("href", "javascript:send_code();");
}
}

 

 

/**
* 发送验证码
*/
function send_code() {
//获取参数
var phone = $.trim($("#account").val());
if (!isPoneAvailable(phone)) {
msg("手机号格式出错");
return;
}
//倒计时
code_countdown();
//发送请求
var data = ajax("send_code",
{
phone: phone
});
//处理数据
if (data.code != 0) {
msg(‘发送成功‘);
}
}