//样式省略...
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.10.0/jquery.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<form action="" method="post">
<div class="login_tel">
<input type="text" required name="username" placeholder="请输入手机号">
<div class="code">
<input type="password" required name="password" placeholder="请输入验证码">
<button type="button" class="get_code">获取验证码</button>
</div>
</div>
<input type="submit" value="登录">
</form>
<script type="text/javascript">
$(function() {
var countdown = 60;
$('.get_code').on('click', function() {
var obj = $(this)
if ((/^1[3456789]\d{9}$/.test(tel))){
console.log('验证码发送成功')
setTime(obj);
}else{
alert('手机号格式有误')
}
})
function setTime(obj) { //验证码倒计时
if (countdown == 0) {
obj.attr('disabled', false);
obj.text("获取验证码");
countdown = 60;
return;
} else {
obj.attr('disabled', true);
obj.text(`重新发送(${countdown})`);
countdown--;
}
setTimeout(function() {
settime(obj)
}, 1000)
}
})
</script>
</body>
</html>
发送短信验证码
最新推荐文章于 2024-05-06 18:26:11 发布
1735
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
