jQuery验证带有图片的验证码问题

最新推荐文章于 2022-07-04 17:47:19 发布

程序员阿卢

最新推荐文章于 2022-07-04 17:47:19 发布

阅读量1.2k

点赞数

分类专栏：学习文章标签： javascript html jquery 验证码

本文链接：https://blog.youkuaiyun.com/ljq54/article/details/39011969

版权

学习专栏收录该内容

37 篇文章

订阅专栏

 
 <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>