js验证码

来源：互联网发布：机房网络布线方案编辑：程序博客网时间：2024/05/27 10:43
非常实用的js验证码,留著日後有用!

<pre name="code" class="js"><!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-image:url(code.jpg);            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 = 6;//验证码的长度       var checkCode = document.getElementById("checkCode");       var selectChar = 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');//所有候选组成验证码的字符，当然也可以用中文的               for(var i=0;i<codeLength;i++)       {                     var charIndex = Math.floor(Math.random()*36);       code +=selectChar[charIndex];                     }//       alert(code);       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 onload="createCode()"><form  action="#">     <input  type="text"   id="input1" />    <input type="text" onclick="createCode()" readonly="readonly" id="checkCode" class="unchanged" style="width: 80px"  /><br />    <input id="Button1"  onclick="validate();" type="button" value="确定" /> </form></body></html></pre>
欢迎交流 http://blog.csdn.net/ycwol/article/details/38433995
0 0