基于Html+Css+javascript的验证码生成

来源:互联网 发布:大小非农数据网站 编辑:程序博客网 时间:2024/05/14 11:50
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head>    <title>无标题页</title>    <style type="text/css">         .code        {             background:lightblue;             font-family:Arial;             font-style:italic;             color:Red;             border:0;             padding:2px 3px;             letter-spacing:3px;             font-weight:bolder;        }         .unchanged        {             border:0;        }    </style>    <script language="javascript" 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,'妈','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',                                 'A','B','C','D','E','F','G','操','I','J','K','L','M','N','O','你','Q','R','S','T','U','V','W','X','Y','Z');      //所有候选组成验证码的字符,当然也可以用中文的       for(var i=0;i<codeLength;i++)       {var charIndex = Math.floor(Math.random()*36);code +=selectChar[charIndex];}       if(checkCode)        {          checkCode.className="code";          checkCode.value = code;        }      }      function validate ()      {       var inputCode = document.getElementById("input1").value;       if(inputCode.length <=0)        {            alert("请输入验证码!");        }       else if(inputCode != code )        {           alert("验证码输入错误!");           createCode();//刷新验证码        }       else        {          alert("^-^ OK");        }       }    </script></head><body>     <input  type="text"   onclick="createCode()" id="input1" />    <input type="text" readonly  id="checkCode" class="unchanged" style="width: 80px"  /><br />    <input id="submit"   onclick="validate();"  type="button" value="确定" /> </body></html>
可以生成随机的验证码,并可以进行检验


0 0