zoukankan      html  css  js  c++  java
  • js-产生随机验证码的具体案例

    先使用U编码转字符,得到随机相同数量的数字、大写字母和小写字母,使随机验证码得到三者的概率相同

    效果图和案例实现代码如下:

    GIF效果图如下所示:

    具体实现代码如下:

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

    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Document</title>
    </head>
        <style>
            input[type='button']{
                margin-left: 100px;
            }
            input{
                margin-top: 200px;
            }
        </style>
    <body>
        <input type="button" id="btn" value="点击生成随机数">
        <input type="text" disabled id='txt'>

        <script>
            var btn = document.getElementById('btn');
            var txt = document.getElementById('txt');
            btn.onclick = function () {
                txt.value = randomYzm();
            }
            txt.value = randomYzm();
           * function randomNum(min, max) {*
               * if (min > max) {*
                    var t = max;
                    max = min;
                    min = t;
                }
               * return Math.floor(Math.random() * (max - min + 1) + min);*
            }
           * function randomYzm(){*
                var strK='';
                // 创建随机验证码库
                for(var i=0;i<4;i++){
                 *   var n=randomNum(0,9);*
                   * var a=String.fromCharCode(randomNum(97,122));*
                   * var A=String.fromCharCode(randomNum(65,90));*
                    strK+=n+a+A;
                }
                var str='';
                // 从验证码库中获取四位验证码,获取几率相等
                for(var j=0;j<4;j++){
                    str+=strK[randomNum(0,strK.length-1)];
                }
                return str;
            }
        </script>
    </body>

    </html>
     
    如果感觉对自己有帮助,麻烦点一下关注,会一直和大家分享知识的,谢谢!!!
  • 相关阅读:
    单元测试
    英语学习app案列分析
    基于GUI的四则运算
    个人作业1——四则运算题目生成程序(基于控制台)
    一种新体验———构建之法
    个人作业3——个人总结(Alpha阶段)
    单元测试
    英语学习APP案例分析
    结对编程(70,73)
    软件工程HW1-四则运算软件
  • 原文地址:https://www.cnblogs.com/piaoyi1997/p/12791842.html
Copyright © 2011-2022 走看看