
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>