zoukankan      html  css  js  c++  java
  • 好用的验证码

    之前一直在新浪博客,/*哈哈其实也没写几个*/,太难用了,以后定居在这里以及我的个人网站,/*我的个人网站目前出了点问题,等弄好后一起更新*/。

    下面是一个比较好用的数字随机验证码,如果希望添加字母,可查看代码里的备注。

    <html lang="en">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>验证</title>
        <script type="text/javascript" src="http://192.168.107.99:80/static/js/jquery-1.8.3.min.js"></script>
        <script type="text/javascript" src="http://192.168.107.99:80/static/js/common.js"></script>
        <script type="text/javascript">
        var code; //在全局 定义验证码  
        function createCode(){
          code = "";
          var codeLength = 4;//验证码的长度  
          var checkCode = document.getElementById("checkCode");
          /*var selectChar = new Array(0, 1, 2, 3, 4, 5, 6, 7, 8, 9);*///所有候选组成验证码的字符,当然也可以用中文的,也可以用字母在这里添加  
          for (var i = 0; i < codeLength; i++) {
            var charIndex = Math.floor(Math.random()*10);
            code += /*selectChar[*/charIndex/*]*/;
          }
          if (checkCode) {
            checkCode.className = "code";
            checkCode.value = code;
          }
        }  
        function validate() {
          var inputCode = document.getElementById("VerifyCode").value;
          if (inputCode.length <= 0) {
            alert("请输入验证码!");
          } else if (inputCode != code) {
            alert("验证码输入错误!");
          createCode();//刷新验证码  
          } else {
          $("#loginfrm").submit();
          }
        }
        $(function(){
            tip("#loginfrm");
            createCode();
        })
        </script>
        <style>
        .login-v {
            height:24px;
            border:1px solid  #25488c;
            padding-left: 3px;
        } 
        .code {
            background-image: url(code.jpg);
            width:80px;
            height:24px;
            font-family: "Microsoft YaHei";
            color:#25488c;
            text-align:center;
            font-size:14px;
            letter-spacing: 3px;
            border:1px solid  #25488c;
        }
        #checkCode {margin-top:0px}
        .unchanged {border: 0;}
        .error { 
    color:red;
    font-size:10pt;
    padding-left:2px;
    line-height:20px;
    } </style> </head> <body> <div class="login-container"> <label>验证码 :</label> <input class="login-v" maxlength="4" name="VerifyCode" type="text"/> <input type="text" onclick="createCode()" readonly="readonly" class="code" id="checkCode"/> </div> </body> </html>
  • 相关阅读:
    yum 安装的软件包卸载
    yum install 软件包的安装路径
    mysqladmin connect to server at 'localhost' failed
    Mysql导入报错 ERROR 1231(42000)
    my.cnf文件格式错误1例
    CVE-2020-11996
    NG ZOORO对于disabled的按钮或者类容添加toolTip提示
    Angular2管道在模板和component.ts中的使用
    NG ZOORO下拉框添加hover提示toolTip功能
    关于Angular项目结构中share文件与public文件的区别
  • 原文地址:https://www.cnblogs.com/futai/p/4980644.html
Copyright © 2011-2022 走看看