原生JS实现获取随机验证码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<button id="btn">获取验证码</button>
<span id="code"></span>
<script type="text/javascript">
var btn = document.getElementById("btn");
var code = document.getElementById("code");
btn.onclick = function  () {
console.log("aaa");
code.innerHTML = randomCode();
}
//把随机出来的数转成 字符
//产生一个数字字母组合的验证码4
function randomCode(){
var sum=0;//记录出现合格条件的数字的次数
var str = "";
while(1){
//在死循环里面 随机产生数字
// a-z     A-Z --》判断ascll码
// 97-122  65-90
// 0-9  出现0-9 满足条件
// 
//随机出 0 - 122 就能产生符合条件的结果

//0-122
var num = Math.round(Math.random()*122);
if(num>=0&&num<=9){
//数字0-9 可以当做验证码中的一个数
sum++;
str+=num;
}else if(num>=97&&num<=122){
//可以当做验证码中的一个数
sum++;
str+=String.fromCharCode(num);
}else if(num>=65&&num<=90){
//可以当做验证码中的一个数
sum++;
str+=String.fromCharCode(num);
}else{
//说明不符合验证码的规则
}
if(sum == 4){
break;
}

}
return str;
}

</script>
</body>
</html>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值