生成四位数验证码js

<!DOCTYPE html>
<html lang='en'>

<head>
    <meta charset='UTF-8'>
    <meta name='viewport' content='width=device-width, initial-scale=1.0'>
    <title>生成四位数的验证码</title>
    <link rel='stylesheet' href='//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/default.min.css'>
    <script src='//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js'></script>
</head>

<body>
    <button>换一个</button>
    <p class="code"></p>
    <pre>
        <code style='max-height: 400px;'>
            let updateCodeBtn = document.querySelector('button')
            let showCode = document.querySelector('.code')
            let code = null
            updateCodeBtn.addEventListener('click',() => {
                code = randomCode()
                showCode.innerText = code
                console.log('随机生成的验证码为', code);
            })
            /**
            * 生成四位数验证码
            * 
            */
            let randomStr = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ' // 62位长度
            //    生成指定范围内的随机整数
            function randomMath(min, max) {
                return Math.round(Math.random() * (max - min) + min)
            }
            //    生曾随机验证码  --> len 生成验证码的位数默认为4位
            let randomCode = (len = 4) => {
                let str = ''
                for (let i = 0; i < len; i++) {
                    str += randomStr[randomMath(0, 61)]
                }
                return str
            }

            code = randomCode()
            showCode.innerText = code
            console.log('字符串长度', randomStr.length);
            console.log('随机生成的验证码为', code);
        </code>
     </pre>
    <script> hljs.highlightAll(); </script>
    <script>
        let updateCodeBtn = document.querySelector('button')
        let showCode = document.querySelector('.code')
        let code = null
        updateCodeBtn.addEventListener('click',() => {
            code = randomCode()
            showCode.innerText = code
            console.log('随机生成的验证码为', code);
        })
        /**
         * 生成四位数验证码
         * 
        */
        let randomStr = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ' // 62位长度
        //    生成指定范围内的随机整数
        function randomMath(min, max) {
            return Math.round(Math.random() * (max - min) + min)
        }
        //    生曾随机验证码  --> len 生成验证码的位数默认为4位
        let randomCode = (len = 4) => {
            let str = ''
            for (let i = 0; i < len; i++) {
                str += randomStr[randomMath(0, 61)]
            }
            return str
        }

        code = randomCode()
        showCode.innerText = code
        console.log('字符串长度', randomStr.length);
        console.log('随机生成的验证码为', code);
    </script>
</body>

</html>

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

向画

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值