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

来源:互联网 发布:安居客网络门店管理 编辑:程序博客网 时间:2024/05/23 00:04
<!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
原创粉丝点击