SoFunction
Updated on 2025-03-09

Simple example of javascript implementing digital verification code


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http:///TR/xhtml1/DTD/">
<html xmlns="http:///1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JS verification code</title>
    <style type="text/css"> 
        .code  
        {  
            background-image:url();  
            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; //Define verification code globally
     function createCode()  
     {   
       code = "";  
var codeLength = 4;//Length of verification code
       var checkCode = ("checkCode");  
var selectChar = new Array(0,1,2,3,4,5,6,7,8,9);//All candidates can also be used in Chinese

       for(var i=0;i<codeLength;i++)  
       {  

          
       var charIndex = (()*10);  
       code +=selectChar[charIndex];  

         
       }  
//       alert(code);  
       if(checkCode)  
       {  
         ="code";  
         = code;  
       }  

     }  

      function validate ()  
     {  
       var inputCode = ("input1").value;  
       if( <=0)  
       {  
alert("Please enter the verification code!");
       }  
       else if(inputCode != code )  
       {  
alert("Verification code input error!");
createCode();//Refresh the verification code
       }  
       else  
       {  
         alert("OK");  
       }  

       }  

    </script> 
</head> 
<body onload="createCode()"> 
<form  action="#"> 
     <input  type="text"   /> 
    <input type="text" onclick="createCode()" readonly="readonly" class="unchanged" style="width: 80px"  /><br /> 
<input   onclick="validate();" type="button" value="okay" />
</form> 
</body> 
</html>