jquery.validate.js截止日期如何使用此驗證程序添加方法

Question

我有一個信用卡處理表單，其中有2個過期選擇字段。像這樣

<select name="qbms_cc_expires_month" id="qbms_cc_expires_month"><option value="01">01</option><option value="02">02</option><option value="03">03</option><option value="04">04</option><option value="05">05</option><option value="06">06</option><option value="07">07</option><option value="08">08</option><option value="09">09</option><option value="10">10</option><option value="11">11</option><option value="12">12</option></select><span class="required">*</span>&nbsp;<select name="qbms_cc_expires_year" id="qbms_cc_expires_year"><option value="12">2012</option><option value="13">2013</option><option value="14">2014</option><option value="15">2015</option><option value="16">2016</option><option value="17">2017</option><option value="18">2018</option><option value="19">2019</option><option value="20">2020</option><option value="21">2021</option></select> 

我加入這個$ .validator.addMethod

$.validator.addMethod(
     "ccexpdate", 
    function (value, element) { 

     // Initialize todays date i.e start date 
     var today = new Date(); 
     var startDate = new Date(today.getFullYear(),today.getMonth(),1,0,0,0,0); 

     // Initialize End/Expiry date i.e. adding 10 years to expire 
     var futureLimitDate= new Date(today.getFullYear()+10,today.getMonth(),1,0,0,0,0); 
     var expDate = value; 

     var expYearCheck=''; 

     // Check Date format 
     var separatorIndex = expDate.indexOf('/'); 
     if(separatorIndex==-1)return false; // Return false if no/found 

     var expDateArr=expDate.split('/'); 
     if(expDateArr.length>2)return false; // Return false if no num/num format found 

     // Check Month for validity 
     if(eval(expDateArr[0])<1||eval(expDateArr[0])>12) 
     { 
      //If month is not valid i.e not in range 1-12 
      return false; 
     } 

     //Check Year for format YY or YYYY 
     switch(expDateArr[1].length) 
     { 
      case 2:expYearCheck=2000+parseInt(expDateArr[1], 10);break; // If YY format convert it to 20YY to it 
      case 4:expYearCheck=expDateArr[1];break; // If YYYY format assign it to check Year Var 
      default:return false;break; 
     } 


     // Calculated new exp Date for ja 
     expDate=new Date(eval(expYearCheck),(eval(expDateArr[0])-1),1,0,0,0,0); 



     if(Date.parse(startDate) <= Date.parse(expDate)) 
     { 
      if(Date.parse(expDate) <= Date.parse(futureLimitDate)) 
      { 
       // Date validated 
       return true;  
      }else 
      { 

       // Date exceeds future date 
       return false; 
      } 

     }else 
     { 

      // Date is earlier than todays date 
      return false; 
     } 


    }, 
    "<br />Must be a valid Expiration Date." 
    ); 

怎樣在我的規則稱之爲：{}部分？ 我想這 qbms_cc_expires_year：{ ccexpdate：{ 月： '#qbms_cc_expires_month'， 年： '#qbms_cc_expires_year' }} ， 但它不工作。

Answer 1

我想通了，希望它可以幫助有人試圖完成相同的事情。我的問題試圖在下面使用jquery.validate.js和$.validator.addMethod。我有兩個字段用於我的截止日期，一個用於月份MM「01」，另一個用於YYYY "<option value="12">2012</option>"，所以我將它們組合爲另一個文本輸入MM/YYYY，並對該字段進行驗證。

$.validator.addMethod(
     "ccexpdate", 
    function (value, element) { 
     // Initialize todays date i.e start date 
     var today = new Date(); 
     var startDate = new Date(today.getFullYear(),today.getMonth(),1,0,0,0,0); 
     // Initialize End/Expiry date i.e. adding 10 years to expire 
     var futureLimitDate= new Date(today.getFullYear()+10,today.getMonth(),1,0,0,0,0); 
     var expDate = value; 
     var expYearCheck=''; 
     // Check Date format 
     var separatorIndex = expDate.indexOf('/'); 
     if(separatorIndex==-1)return false; // Return false if no/found 
     var expDateArr=expDate.split('/'); 
     if(expDateArr.length>2)return false; // Return false if no num/num format found 
     // Check Month for validity 
     if(eval(expDateArr[0])<1||eval(expDateArr[0])>12) 
     { 
      //If month is not valid i.e not in range 1-12 
      return false; 
     } 
     //Check Year for format YY or YYYY 
     switch(expDateArr[1].length) 
     { 
      case 2:expYearCheck=2000+parseInt(expDateArr[1], 10);break; // If YY format convert it to 20YY to it 
      case 4:expYearCheck=expDateArr[1];break; // If YYYY format assign it to check Year Var 
      default:return false;break; 
     } 
     // Calculated new exp Date for ja 
     expDate=new Date(eval(expYearCheck),(eval(expDateArr[0])-1),1,0,0,0,0); 
     if(Date.parse(startDate) <= Date.parse(expDate)) 
     { 
      if(Date.parse(expDate) <= Date.parse(futureLimitDate)) 
      { 
       // Date validated 
       return true;  
      }else 
      { 
       // Date exceeds future date 
       return false; 
      } 
     }else 
     { 
      // Date is earlier than todays date 
      return false; 
     } 
    }, 
    "<br />Must be a valid Expiration Date." 
    ); 

我有我的到期日兩個字段如下：

<select name="qbms_cc_expires_month" id="qbms_cc_expires_month"> 
<option value="01">01</option> 
<option value="02">02</option> 
<option value="03">03</option> 
<option value="04">04</option> 
<option value="05">05</option> 
<option value="06">06</option> 
<option value="07">07</option> 
<option value="08">08</option> 
<option value="09">09</option> 
<option value="10">10</option> 
<option value="11">11</option> 
<option value="12">12</option> 
</select> 
<select name="qbms_cc_expires_year" id="qbms_cc_expires_year"> 
<option value="12">2012</option> 
<option value="13">2013</option> 
<option value="14">2014</option> 
<option value="15">2015</option> 
<option value="16">2016</option> 
<option value="17">2017</option> 
<option value="18">2018</option> 
<option value="19">2019</option> 
<option value="20">2020</option> 
<option value="21">2021</option> 
</select> 

我加入這個領域我的第二個的末端選擇：

<input type="text" name="qbmsCombined" id="qbmsCombined" value="" style="width:45px;height:16px;" readonly="readonly"> 

而且我的jQuery這樣

$().ready(function() { 
    // combine exp date fields and validate new field 
    $("#qbms_cc_expires_month,#qbms_cc_expires_year").change(function() { 
     $("input[type='text'][name='qbmsCombined']").val($("#qbms_cc_expires_month").val() + '/' + $("#qbms_cc_expires_year").val()); 

    }); 
    // validate signup form on keyup and submit 
    $("#checkoutForm").validate({ 
     rules: { 
     qbms_cc_owner: { 
       required: true 
      }, 
     qbms_cc_number: { 
       required: true, 
       minlength: 13, 
       maxlength: 16, 
       creditcard: true 
      }, 
      qbmsCombined: { 
       ccexpdate: true 
      }, 
      qbms_cc_cvv2: { 
       required: true, 
       minlength: 3, 
       maxlength: 4 
      },  
     }, 
     messages: { 

      qbms_cc_owner: { 
       required: "<br />Please enter the name on the Credit Card" 
      }, 
      qbms_cc_number: { 
       required: "<br />Please enter the Credit Card Number", 
       minlength: "<br />Credit Card Number must be between 13 and 16 digits", 
       maxlength: "<br />Credit Card Number is over 16 digits", 
       creditcard: "<br />Credit Card Number is invalid" 
      }, 
       qbms_cc_cvv2: { 
       required: "<br />Please enter the Credit Card's Security Code", 
       minlength: "<br />Credit Card's Security Code must be at least 3 digits", 
       maxlength: "<br />Credit Card's Security Code must be 4 digits or less" 
      }, 
     } 

    }); 

    $('form#checkoutForm').submit(function(evt){ 
     if($('#checkoutForm').valid()) 
      return true 
     else 
     evt.preventDefault(); 
      return false; 

    }); 
});