JS验证码

  1. <PRE class=js name="code"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  2. <html xmlns="http://www.w3.org/1999/xhtml" >  
  3. <head>  
  4.     <title>无标题页</title>  
  5.     <style type="text/css">  
  6.         .code  
  7.         {  
  8.             background-image:url(code.jpg);  
  9.             font-family:Arial;  
  10.             font-style:italic;  
  11.             color:Red;  
  12.             border:0;  
  13.             padding:2px 3px;  
  14.             letter-spacing:3px;  
  15.             font-weight:bolder;  
  16.         }  
  17.         .unchanged  
  18.         {  
  19.             border:0;  
  20.         }  
  21.     </style>  
  22.     <script language="javascript" type="text/javascript">  
  23.         var code ; //在全局 定义验证码  
  24.         function createCode()  
  25.         {   
  26.             code = "";  
  27.             var codeLength = 4;//验证码的长度  
  28.             var checkCode = document.getElementById("checkCode");  
  29.             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');//所有候选组成验证码的字符,当然也可以用中文的      
  30.             for(var i=0;i<codeLength;i++)  
  31.             {     
  32.                 var charIndex = Math.floor(Math.random()*36);  
  33.                 code +=selectChar[charIndex];     
  34.             }  
  35.             if(checkCode)  
  36.             {  
  37.                 checkCode.className="code";  
  38.                 checkCode.value = code;  
  39.             }        
  40.         }      
  41.         function validate (flag)  
  42.         {  
  43.             var inputCode = document.getElementById("input1").value;  
  44.             //不区分大小写  
  45.             if(flag==1)  
  46.             {  
  47.                 inputCode = inputCode.toUpperCase();  
  48.             }  
  49.             if(inputCode.length <=0)  
  50.             {  
  51.                 alert("请输入验证码!");  
  52.                 return false;  
  53.             }  
  54.             else if(inputCode != code )  
  55.             {  
  56.                 alert("验证码输入错误!");  
  57.                 createCode();//刷新验证码  
  58.                 return false;  
  59.             }  
  60.             else  
  61.             {  
  62.                 alert("OK");  
  63.                 return true;  
  64.             }        
  65.         }      
  66.     </script>  
  67. </head>  
  68. <body onload="createCode()">  
  69. <form  action="" method="post">  
  70.     <input  type="text"   id="input1" name="input1"/>  
  71.     <input type="text" onclick="createCode()" readonly="readonly" id="checkCode" class="unchanged" style="width: 80px"  />  
  72.     <input id="Button1"  onclick="return validate(1);" type="button" value="确定" />   
  73. </form>  
  74. </body>  
  75. </html>  
  76. </PRE>  
posted @ 2017-03-16 02:13  SKuang  阅读(340)  评论(0编辑  收藏  举报