首页>>表单>>表单验证，计算相加值 计算和验证表单(2014-07-03)

表单验证，计算相加值 计算和验证表单

计算相加后如果填入的是正确的值才能提交表单

表单验证，计算相加值 计算和验证表单
演示
下载
赞赏支持
立刻微信赞赏支持 关闭

 

XML/HTML Code
  1. <div class="captcha">  
  2.   
  3. <form method="post" id="form">  
  4. <input type="submit">  
  5. </form>  
  6. </div>  

 

JavaScript Code
  1. <script type="text/javascript">  
  2.   
  3.         $(function(){  
  4.             $('#form').ebcaptcha();  
  5.         });  
  6.   
  7.     </script>  

 

JavaScript Code
  1. (function($){  
  2.   
  3.     jQuery.fn.ebcaptcha = function(options){  
  4.   
  5.         var element = this;   
  6.         var submit = $(this).find('input[type=submit]');  
  7.         $('<label id="ebcaptchatext"></label>').insertBefore(submit);  
  8.         $('<input type="text" class="textbox" id="ebcaptchainput"/><br/><br/>').insertBefore(submit);  
  9.         var input = this.find('#ebcaptchainput');   
  10.         var label = this.find('#ebcaptchatext');   
  11.           
  12.         $(element).find('input[type=submit]').attr('disabled','disabled');   
  13.   
  14.           
  15.         var randomNr1 = 0;   
  16.         var randomNr2 = 0;  
  17.         var totalNr = 0;  
  18.   
  19.   
  20.         randomNr1 = Math.floor(Math.random()*10);  
  21.         randomNr2 = Math.floor(Math.random()*10);  
  22.         totalNr = randomNr1 + randomNr2;  
  23.         var texti = "What is "+randomNr1+" + "+randomNr2;  
  24.         $(label).text(texti);  
  25.           
  26.       
  27.         $(input).keyup(function(){  
  28.   
  29.             var nr = $(this).val();  
  30.             if(nr==totalNr)  
  31.             {  
  32.                 $(element).find('input[type=submit]').removeAttr('disabled');                 
  33.             }  
  34.             else{  
  35.                 $(element).find('input[type=submit]').attr('disabled','disabled');  
  36.             }  
  37.               
  38.         });  
  39.   
  40.         $(document).keypress(function(e)  
  41.         {  
  42.             if(e.which==13)  
  43.             {  
  44.                 if((element).find('input[type=submit]').is(':disabled')==true)  
  45.                 {  
  46.                     e.preventDefault();  
  47.                     return false;  
  48.                 }  
  49.             }  
  50.   
  51.         });  
  52.   
  53.     };  
  54.   
  55. })(jQuery);  

 


原文地址:http://www.freejs.net/article_biaodan_361.html