
 
 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4     <meta charset="UTF-8"></meta>
 5     <title>js生成验证码</title>
 6 </head>
 7 <body>
 8     
 9     <button id="btn">获取验证码</button>
10     <span id="code"></span>
11     
12 </body>
13 <script>
14     var btn = document.getElementById("btn");
15     var code = document.getElementById("code");
16     btn.onclick = function () {
17         console.log("aaa");
18         code.innerHTML = randomCade();
19     }
20     window.onload = function () {
21         code.innerHTML = randomCade();
22     }
23 
24     //把随机出来的数转成字符
25     //产生一个数字字母组合的验证码
26     function randomCade() {
27         var sum = 0;  //记录出现合格条件的数字的次数
28         var str = "";
29         while (1){
30             var num = Math.round(Math.random()*122);
31             console.log(num);
32             if (num >= 0 && num <= 9){
33                 sum ++;
34                 str += num;
35             }else if (num >= 97 && num <= 122){
36                 sum++;
37                 str += String.fromCharCode(num);
38             }else if(num >= 65 && num <= 90){
39                 sum++;
40                 str+=String.fromCharCode(num);
41             }else {
42                 //不符合验证码的规则
43             }
44             if (sum == 4) {
45                 break;
46             }
47         }
48         return str;
49     }
50 </script>
51 </html>