js(jquery)驗證碼設置!

 花了一個早上,做了個JS驗證碼。誰知道,這東西根本沒有,沒法防止重複提交的。

悲劇咯!驗證碼本來用來防止機械的破壞,誰知道這搞的人麻煩了,還是一樣被重複提交!!

求 設置 驗證碼思路啊……到底這個是怎麼搞的啊!!

根本不知道驗證碼思路是怎麼的,那怎麼搞啊。

唉,我真浮躁,說是WEB編程,但是數據流是什麼我都不知道……

 

  1. <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %> 
  2.  
  3.  
  4. <html xmlns="http://www.w3.org/1999/xhtml" > 
  5. <head id="Head1" runat="server"> 
  6.     <title>無標題頁</title> 
  7.      
  8.     <!--Vali--> 
  9.     <script type="text/javascript" src="Jscript/jquery-1.3.2.min.js"></script> 
  10.     <script type="text/javascript" src="Jscript/lqyvalictrl.js"></script> 
  11.     <link rel="stylesheet" href="css/Style.css" type="text/css" /> 
  12.     <!--Vali End--> 
  13.      
  14.      
  15. </head> 
  16. <body> 
  17.     <form id="form1" runat="server" > 
  18.      
  19.     <div> 
  20.         <input type="text" id="txtName" value="LQY" /> 
  21.         <input type="button" id="btnSubmit" value="HTMLClick" onclick="lqyCheckValidata('form1','asp');" /> 
  22.         <!--<asp:Button ID="btnS" runat="server" OnClientClick="return lqyCheckValidata('form1','aspnet');" OnClick="test" Text="AspClick" />--> 
  23.         <div>測試樣式有沒有影響</div> 
  24.         <div style="float:left;"> 
  25.             <div class="lqyCodeInput" ><input type="text" id="txtLqyValiCode" style="width:40px;padding-left:3px;" /></div> 
  26.             <div class="lqyVali" id="lqyValBox"  ></div>         
  27.         </div> 
  28.         <div>測試樣式有沒有影響</div> 
  29.     </div> 
  30.     </form> 
  31. </body> 
  32. </html> 

 

lqyvalictrl.js

 

  1. // JScript 文件 
  2.  
  3.         
  4.         document.write("<div class=\"lqyVali\" style=\"width:500px;display:none;\" >"); 
  5.         document.write("<img src=\"ValidataCode/1_0.gif\" class=\"lqyValNumber\" alt=\"yeforVal\" />"); 
  6.         document.write("<img src=\"ValidataCode/1_1.gif\" class=\"lqyValNumber\" alt=\"yeforVal\" />"); 
  7.         document.write("<img src=\"ValidataCode/1_2.gif\" class=\"lqyValNumber\" alt=\"yeforVal\" />"); 
  8.         document.write("<img src=\"ValidataCode/1_3.gif\" class=\"lqyValNumber\" alt=\"yeforVal\" />"); 
  9.         document.write("<img src=\"ValidataCode/1_4.gif\" class=\"lqyValNumber\" alt=\"yeforVal\" />"); 
  10.         document.write("<img src=\"ValidataCode/1_5.gif\" class=\"lqyValNumber\" alt=\"yeforVal\" />"); 
  11.         document.write("<img src=\"ValidataCode/1_6.gif\" class=\"lqyValNumber\" alt=\"yeforVal\" />"); 
  12.         document.write("<img src=\"ValidataCode/1_7.gif\" class=\"lqyValNumber\" alt=\"yeforVal\" />"); 
  13.         document.write("<img src=\"ValidataCode/1_8.gif\" class=\"lqyValNumber\" alt=\"yeforVal\" />"); 
  14.         document.write("<img src=\"ValidataCode/1_9.gif\" class=\"lqyValNumber\" alt=\"yeforVal\" />"); 
  15.         document.write("</div>"); 
  16.          
  17.          
  18.        var LqystrValiCode="";  
  19.          
  20.          
  21.          
  22.         $(function () 
  23.         { 
  24.  
  25.             var lqyValNum=new Array();         
  26.              
  27.              
  28.              
  29.              
  30.             
  31.             lqyValNum[0]=lqyGetRandom(); 
  32.             lqyValNum[1]=lqyGetRandom(); 
  33.             lqyValNum[2]=lqyGetRandom(); 
  34.             lqyValNum[3]=lqyGetRandom(); 
  35.             var stringbuild=""
  36.              
  37.             for (i in lqyValNum) 
  38.             { 
  39.                 LqystrValiCode+= lqyValNum[i].toString(); 
  40.                 stringbuild+=lqyCreatePicture(lqyValNum[i].toString()); 
  41.                  
  42.             } 
  43.              
  44.             lqyShowPicture(stringbuild); 
  45.              
  46.              
  47.             //$('#txtLqyValiCode').val(LqystrValiCode); 
  48.  
  49.         }); 
  50.          
  51.         function lqyShowPicture(imgitem) 
  52.         { 
  53.            document.getElementById("lqyValBox").innerHTML=imgitem; 
  54.         } 
  55.          
  56.         function lqyCreatePicture(lcodeNumber) 
  57.         { 
  58.                         
  59.                 
  60.               return "<img src='"+$('.lqyValNumber').eq(lcodeNumber).attr('src')+"' alt=''/>"; 
  61.                
  62.  
  63.         } 
  64.          
  65.          
  66.         function lqyCheckValidata(formid,ctrlType) 
  67.         { 
  68.             var isVali=false
  69.             var txt=document.getElementById("txtLqyValiCode"); 
  70.              
  71.  
  72.                 if(txt.value==LqystrValiCode)//驗證編碼 
  73.                 { 
  74.                     isVali=true
  75.                 } 
  76.                  
  77.                  
  78.                  
  79.                  
  80.                 if (isVali) 
  81.                 { 
  82.                     if(ctrlType=="asp"
  83.                     { 
  84.                         $("#"+formid).submit(); 
  85.                     } 
  86.                      
  87.                     if (ctrlType=="aspnet"
  88.                     { 
  89.                         // 
  90.                     } 
  91.                  } 
  92.                   
  93.              return isVali; 
  94.         } 
  95.          
  96.          
  97.         function lqyGetRandom() 
  98.         { 
  99.             return parseInt(Math.random()*10); 
  100.         } 
  101.      

 

Style.css

 

 

  1. body { 
  2.  
  3.  
  4. /************************/ 
  5.         .lqyVali 
  6.         { 
  7.             padding:0px 0px
  8.             margin:0px 0px
  9.             width:70px
  10.             height:17px
  11.             overflow:hidden
  12.             float:left
  13.             margin-top:3px
  14.         } 
  15.         .lqyVali img 
  16.         { 
  17.             padding:0px 0px
  18.             margin:0px 0px
  19.         } 
  20.         .lqyCodeInput 
  21.         { 
  22.             float:left;margin-right:5px
  23.         } 
  24.  
  25. /************************/ 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章