JavaScript实现4位随机验证码的生成
导读：收集整理的这篇文章主要介绍了JavaScript实现4位随机验证码的生成，觉得挺不错的，现在分享给大家，也给大家做个参考。 本文实例为大家分享了JavaScript生成4位随机验证码的具...
收集整理的这篇文章主要介绍了JavaScript实现4位随机验证码的生成，觉得挺不错的，现在分享给大家，也给大家做个参考。 本文实例为大家分享了JavaScript生成4位随机验证码的具体代码，供大家参考，具体内容如下
代码：
@H_360_5@!doctyPE htML> html> head> meta charset="utf-8"> tITle> 4位随机验证码的生成/title> style> label{ color:aqua; float:left; font-Size: 20px; line-height:2em; } #tex{ display:inline-block; width:50px; height: 25px; float:left; text-align: center; font-size:15px; margin-top:10px; } #showyz{ border:3px solid green; color:blue; width:90px; height:40px; text-align:center; float:left; margin-left:15px; line-height: 2.5em; } #hyz{ background-color:burlywood; border:1px solid burlywood; width:50px; height:20px; float: left; margin-left:20px; margin-top: 10px; margin-right:15px; } #BTn{ } /style> /head> body> label for="tex"> 请输入验证码：/label> input type="text" id="tex" maxlength="4" autofocus> div id="showyz"> /div> div id="hyz"> 换一张/div> br> input type="button" id="btn" value="确认"> /body> script> //定义个空数组保存62个编码VAR codes=[]; //将数字对应的编码保存到codes数组中，数字编码范围【48-57】for(var i=48; i=57; i++){ codes.push(i); } //将大写字母对应的编码保存到codes数组中，对应编码范围【65-90】for(var i=65; i=90; i++){ codes.push(i); } //将小写字母对应的编码保存到codes数组中，对应编码范围【97-122】for(var i=97; i=122; i++){ codes.push(i); } //定义个方法生成62位随机数作为数组角标返回随机的编码，再将其编码转化为对应数字或者字母function suiji(){ var arr=[]; //定义个数组保存4位随机数 for(var i=0; i4; i++){ var index=Math.floor(Math.random()*(61-0+1)+0); //生成个随机数 var char=String.FromCharCode(codes[index]); //解码 arr.push(char); //存入到数组arr中} return arr.join(""); //将数组转为字符串，以空格分隔，并返回} var yzm=suiji(); //调用方法，将放回的验证码返回到yzm中//获取上述元素var tex=document.getElementById("tex"); var showyz=document.getElementById("showyz"); var hyz=document.getElementById("hyz"); var btn=document.getElementById("btn"); //将验证码写入到id为showyz的div中showyz.innerHTML=yzm; //实现换一张验证码功能hyz.οnclick=function(){ yzm=suiji(); showyz.innerHTML=yzm; } //将自己输入的验证码与获取的随机验证码验证btn.οnclick=function(){ var textvalue=tex.value; //获取输入的值 if(textvalue.toLowerCase()==yzm.toLowerCase()){ //将值都转为小写比较 alert("验证码输入正确！"); yzm=suiji(); showyz.innerHTML=yzm; tex.value=""; } else{ alert("验证码输入错误，请重新输入！"); yzm=suiji(); showyz.innerHTML=yzm; tex.value=""; } } /script> /html>以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。
您可能感兴趣的文章:- JS实现随机生成验证码
- JavaScript实现随机生成验证码及校验
- JavaScript点击按钮生成4位随机验证码
- JavaScript函数封装随机颜色验证码(完整代码)
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： JavaScript实现4位随机验证码的生成
本文地址： https://pptw.com/jishu/594299.html