四位随机验证码

最新推荐文章于 2024-11-12 18:03:19 发布

原创最新推荐文章于 2024-11-12 18:03:19 发布 · 588 阅读

CC 4.0 BY-SA版权

   <style>
        #block {
            display: inline-block;
            width: 90px;
            height: 35px;
            line-height: 35px;
            border: 1px solid silver;
            text-align: center;
            font-size: 18px;
            letter-spacing: 5px;
        }
        #link {
            display: inline-block;
        }
    </style>
</head>
<body>
   <div id="block">
       Ab4F
   </div>
   <a href="javascript:;" id="link">看不清楚换一张</a>
</body>
<script>
    var blockBox=document.getElementById('block');
    var link = document.getElementById('link');
    function  queryCode() {
        //准备验证码获取的范围
        var codeArea = 'qwertyuiopasdfghjkzxcvbnm' +
                'QWERTYUIOPASDFGHJKLZXCVBNM' +
                '1234567890';
        var mm='';
        for (var i = 0;i<4;i++) {
            var n =Math.round(Math.random()*61);
            var m =codeArea.charAt(n);
            mm+=m;
        }
        return mm;
    }
    //开始加载页面和点击link就需要生成一个验证码
    block.innerHTML = queryCode();//执行方法  把返回的验证码存到block 中
    link.onclick = function () {
        block.innerHTML = queryCode();
    };