基础版本:生成的验证码只包含数字,用字符拼接组成验证码
body里设置一个存放验证码的盒子,取id为box,用于显示和点击切换验证码
<div id="box"></div>
创建验证码函数,点击验证码可进行切换
function yzm() {
var str = '';
for (var i = 1; i <= 4; i++) { //四次的循环
str += parseInt(Math.random() * 10); //拼接数字字符串,拼接四次
}
return str;
}
//设置标签元素,点击标签切换验证码。
box.innerHTML = yzm();
box.onclick = function() { //事件处理函数,点击box,函数就调用了
box.innerHTML = yzm();
};
进阶版本:
生成四位验证码,包含数字和大小写字母
//验证码 防止高并发
function getSecurityCode() {
var arr = [];
for (var i = 48; i < 123; i++) {
//48-57 0-9
//65-90 A-Z
//97-122 a-z
if (i > 57 && i < 65) {
i = 64;
continue; //跳过下面的语句 进行下次循环
}
if (i > 90 && i < 97) {
i = 96;
continue;
}
arr.push(String.fromCharCode(i));
}
arr.sort(function() {
return Math.random() - 0.5;
});
arr.length = 4;
return arr.join("");
}
var str = getSecurityCode();
prompt("请输入验证码", str)
alert(str);