JavaScript随机验证码函数（字母加数字随机生成），指定验证码生成几位，JavaScript点击按钮在页面生成随机验证码js源代码

来来来，你是不是迫不及待想看源码了，别，别这样，咱们先来分析一下思路怎么样？

首先我们知道js中生成随机数的方法就是Math.random(）；

我们需要生成的随机数从0~9或者A~Z或者a~z中随机抽取一位；

那么我们此时有两种选择：

　　方法一：生成一个数组，装有单个字符，长度为26+26+10，一共62，也就是随机下标0~61，对应的random写法为：parseInt(Math.random()*62))；//什么？你看不懂这句话，那建议你看看我另一篇文章Math.random小技巧   网址：https://www.cnblogs.com/shujiemao/p/13881957.html

 

　　po个代码

　　function RandomVerificationCode(n) {

            var container = '1234567890qwertyuioplkjhgfdsazxcvbnmAQWSZXCDERFVTGBYHNUJMIKOLP';

            var arr = [];   //定义一个空数组来接收生成的随机验证码

            for (var i = 0; i < n; i++) {

                var num = parseInt(Math.random() * 62);

                arr.push(container[num]);

            }

            

　　　n = arr.join("");　　//使用n或者自定义一个变量来接收arr数组生成的字符串

            alert(n);　　　　//来检验是否成功生成随机数，可以删除的语句

　　　return n;          //返回n，可以自定义一个变量去接收验证码

        }

        RandomVerificationCode(6);

 

 

 

　　方法二：利用大小写字母的ASCII码值

　　　　　　A~Z 的ASCII码范围为65~90；

　　　　　　a~z的ASCII码范围为97~122；

　　　　　　那么就生成一个随机ASCII码值范围的数对应下标为0~121，然后再编写一个判断函数来判断生成的随机数是不是想要的ASCII码值

     po个代码：

　　　　

　　　function RandomVerificationCode(n) {

            var arr = [];   //定义一个空数组来接收生成的随机验证码

            for (var i = 0; i < n; i++) {

                var num = parseInt(Math.random()*123);

                if(num >=1 && num <=10){

                    arr.push(num);   //1~10直接添加给arr即可

                }else if(num >= 65 && num <= 90 || num >=97 && num <=122){

                    arr.push(String.fromCharCode(num));   //push（）方法用来给arr添加元素，使用String.fromCharCode（）方法可以将接收到的num也就是字母所对应的ASCII码值转换成对应字母

                }else{

                    i--;              //控制循环次数，如果遇到了不是需要的范围对应的ASCII码值，则i--来控制循环次数

                }

            }

            n = arr.join("");　　//使用n或者自定义一个变量来接收arr数组生成的字符串

            alert(n);　　　　//来检验是否成功生成随机数，可以删除的语句

　　　return n;          //返回n，可以自定义一个变量去接收验证码

        }

        RandomVerificationCode(6);

 

 

好了，只弹出来一个验证码是不是有点无聊，来实现用按钮来控制页面生成随机验证码吧

好了好了，我好懒啊，我po一张图你写写代码练一练好不好嘛

 

让我们一起努力成为一个合格的小前端吧，如果你觉得这篇文章帮助到你了，点个赞留句鼓励再走吧！谢谢观看