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>