用纯js写验证码 【简单实用】

 先看效果图。HTML部分就展示出来了。直接看js部分吧

<script>
        //设置一个全局的变量,便于保存验证码
    var code;
    function createCode(){
        //首先默认code为空字符串
        code = '';
        //设置长度,这里看需求,我这里设置了6
        var Length = 6;
        var textValue = document.getElementById('code');
        //设置随机字符
        var arr = new Array(0,1,2,3,4,5,6,7,8,9,'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');
        //循环Length 
        for(var i = 0; i < Length; i++){
            //设置随机数范围, 以为数组的长度是36 所以 Math.random()*36  
             code+=arr[Math.floor(Math.random()*36)];
        }
        //将拼接好的字符串赋值给展示的Value
        textValue .value = code;
    }

    //下面就是判断是否== 的代码,无需解释
    function validate(){
        var Value = document.getElementById('input').value.toUpperCase();
        if(Value ==0){
            alert('请输入验证码');
        }else if(Value != code){
            alert('验证码不正确,请重新输入');
            Value = ' ';
            createCode();
        }else{
            alert('验证成功!')
        }
    }

    //设置此处的原因是每次进入界面展示一个随机的验证码,不设置则为空
    window.onload = function (){

        createCode();
    }
    </script>

直接复制运行就可以了  

猜你喜欢

转载自blog.csdn.net/weixin_43932281/article/details/84999185