js发送验证码以及验证

效果:点击“点击发送验证码”会随机获得一个六位验证码,同时“点击发送验证码按钮”改为“再发一次”。将验证码输入input框内验证,正确提示验证码挣钱,错误提示验证码错误。

实现效果:


    <input type="text" placeholder="请输入验证码">
    <button></button>
    <div></div>
    <button></button>

    <script>

        var inp = document.querySelector('input')
        var div = document.querySelector('div')
        var but = document.querySelectorAll('button')

        but[0].innerHTML = '提交'
        but[1].innerHTML = '点击发送验证码'

        var k = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ'
        var b = ''
        but[1].onclick = function () {
            b = ''
            but[1].innerHTML = '再发送一次'
            for (var i = 0; i <= 5; i++) {
                var n = kun(0, k.length - 1)
                b += k[n]
            }
            div.innerHTML = b
        }
        
        but[0].onclick = function () {
            var inps = inp.value
            if (inps == b) {
                alert('验证码正确')
            }else {
                alert('验证码错误')
            }
        }

        function kun(min, max) {
            return Math.floor(Math.random() * (max - min + 1) + min)
        }
    </script>

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值