js随机生成4位验证码,包括大小写(简单版)

这篇博客介绍了两种简单的JavaScript方法来生成4位验证码,包括数字和大小写字母。第一种方法较为基础,第二种利用Unicode编码并带有页面刷新功能,但存在一些限制,如数字和字母位置固定。作者指出,后续的博客会有更完善的实现方式。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

第一种是最笨的一种办法来实现验证码中既有数字又有大小写,第二种用unicode编码更方便一点,还顺便加了个验证刷新的作用,但刷新的是整个页面,同时还有个bug,就是数字及小写、大写的位置是固定的,更完美的写法请看后面的博客,谢谢!

<h4>随机生成4位验证码(randomCode 范围[a-z|0-9|A-Z])
    arr = []
    验证的时候,不区分大小写</h4>
    <input type="text" id="aaa">
    <button id="btn">验证</button>
    <button onclick="window.location.reload()">刷新</button>
    <script>
        var aa = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
        var bb = ['a', 'b', 'c', 'd', 'e', 'f', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
        var cc = ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"];
        var dd = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 'a', 'b', 'c', 'd', 'e', 'f', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z', "A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U", "V", "W", "X", "Y", "Z"]
        var str = "";
        for (var i = 0; i < 4; i++) {
            var a = aa[Math.round(Math.random() * (aa.length - 1))]
            var b = bb[Math.round(Math.random() * (bb.length - 1))]
            var c = cc[Math.round(Math.random() * (cc.length - 1))]
            var d = dd[Math.round(Math.random() * (dd.length - 1))]
            str = a + b + c + d;
        }
        document.write(str)
        btn.onclick = function () {
            var bbb = aaa.value;
            if (str.toLowerCase() === bbb.toLowerCase()) {
                alert('正确')
            } else {
                alert('错误')
            }
        }
    <input type="text" id="f">
    <button id="btn">验证</button>
    <button onclick="window.location.reload()">刷新</button>
    <script>
        var a = [];
        for (var i = 48; i <= 57; i++) {
            // 把对应的unicode值转化为对应的字符
            var str = String.fromCharCode(i)
            a.push(str)
        }
        var b = [];
        for (var i = 97; i <= 122; i++) {
            // 把对应的unicode值转化为对应的字符
            var str = String.fromCharCode(i)
            b.push(str)
        }
        var c = []
        for (var i = 65; i <= 90; i++) {
            // 把对应的unicode值转化为对应的字符
            var str = String.fromCharCode(i)
            c.push(str)
        }
        var d = (a.concat(b)).concat(c)
        var e = '';
        for (var i = 0; i < 4; i++) {
            var aa = a[Math.round(Math.random() * (a.length - 1))]
            var bb = b[Math.round(Math.random() * (b.length - 1))]
            var cc = c[Math.round(Math.random() * (c.length - 1))]
            var dd = d[Math.round(Math.random() * (d.length - 1))]
            e = aa + bb + cc + dd;
        }
        document.write(e)
        btn.onclick = function () {
            var g = f.value;
            if (g.toLowerCase() === e.toLowerCase()) {
                alert('正确')
            } else {
                alert('错误')
            }
        }
    </script>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值