用Javascript实现随机验证码
思路：这个验证码脚本和随机抽取的思路是差不多的。先把一组数字和字母放入数组chars中，再应用Math对象下的几个API生成随机数，利用for循环语句循环4次，拼接到每次循环的后面即可。
- HTML部分
<div id="code"></div>
<button onclick="creatCode()">验证码</button>
- JS部分
1.用数组chars保存验证码里出现的字符
var chars = ['A', 'B', 'C', 'D', 'a', 'b', 'c', 'd', '0', '1', '2', '3']
2.定义一个初始值为空的字符串变量为最终产生的随机验证码
var randCode = " ";
3.利用for循环将生成的动作重复4次
for (var i = 0; i < 4; i++) {
}
4.随机获取0~9的一个整数，作为下标找元素，再与数组chars下标相乘，接着再用floor()这个API取整，定义为randPosition（关键部分）
for (var i = 0; i < 4; i++) {
var randPosition = Math.floor( Math.random() * (chars.length - 1))
}
5.利用自加+=将随机生成的字符连接到自身的后边
for (var i = 0; i < 4; i++) {
var randPosition = Math.floor( Math.random() * (chars.length - 1))
randCode += chars[randPosition];
}
6.生成结束后，将内容显示到页面中
document.getElementById("code").innerHTML = randCode;
- 结果展示
- 总体代码
<body>
<div id="code"></div>
<button onclick="creatCode()">验证码</button>
<script>
function creatCode() {
var chars = ['A', 'B', 'C', 'D', 'a', 'b', 'c', 'd', '0', '1', '2', '3'];
var randCode = "";
for (var i = 0; i < 4; i++) {
var randPosition = Math.floor(Math.random() * (chars.length - 1));
randCode += chars[randPosition];
}
document.getElementById("code").innerHTML = randCode;
}
</script>
</body>