短信验证码发送

时间:2022-09-25 21:02:38

效果:

短信验证码发送
短信验证码发送
短信验证码发送

实现代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>message</title>
</head>
<body>
<input type="text" name="phone"></input>
<input type="button" value="发送短信"></input>
<script type="text/javascript">

var inp = document.getElementsByTagName('input'); //获取发送短信按钮
var sec = 10; //设置发送时间
var timer; //设置一个计时器
var flag = 1; //做一个标记量,如果户没有点击的时候,标记变量为1;如果用户点击了,标记变量设为0

inp[1].onclick = function()
{
if (flag == 1) {
var _this = this;
timer = setInterval(function(){
sec--;
if (sec <=0 ) {
flag = 1;
sec = 10;
_this.value = '重新发送验证码';
clearInterval(timer);
} else {
flag = 0;
_this.value = sec + '秒后重新发送';
}

},1000);
}


}



</script>
</body>
</html>


说明:

以上均是前端的实现,后端代码日后会推送