如何使用jquery.validate.min.js驗證電話號碼和電子郵件？

Question

我已經設法修改了一個jQuery表單驗證示例來處理我的網站，但我不知道如何確保它只是在電話號碼字段中輸入的數字，並且只是在電子郵件字段中輸入的電子郵件地址。

請任何人都可以幫忙嗎？

也想知道是否有什麼可以改善？

<script language="javascript" type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"></script> 
<script> 
$(function() { 
    $("#quickform").validate({ 
      rules: { 
        name: { 
         required: true 
        }, 
        phone: { 
         required: true, 
         phonevalidation: true 
        }, 
        email: { 
         required: true, 
         emailvalidation: true 
        }, 
        enquiry: { 
         required: true 
        } 

      }, 
      messages: { 
        name: { 
         required: "Please enter your name."       
        }, 
        phone: { 
         required: "Please enter your phone number."       
        }, 
        email: { 
         required: "Please enter your email address."       
        }, 
        enquiry: { 
         required: "Please enter your enquiry."       
        } 
      }, 
    }); 
    $.validator.addMethod("phonevalidation", 
      function(value, element) { 
        return /^[A-Za-z\d=#$%@_ -]+$/.test(value); 
      }, 
    "Please enter a valid phone number." 
    ); 
    $.validator.addMethod("emailvalidation", 
      function(value, element) { 
        return /^[A-Za-z\d=#$%@_ -]+$/.test(value); 
      }, 
    "Please enter a valid email address." 
    ); 
}); 
</script> 

編輯：

已經有很多的例子驗證方法，但它是不接受特殊字符。我只需要了解如何將/^[A-Za-z \ d =＃$％@ _ - ] + $ /更改爲電子郵件和數字驗證。

Answer 1

有已經存在於驗證框架email和phone規則

<script language="javascript" type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"></script> 
<script language="javascript" type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/additional-methods.js"></script> 
<script> 
$(function() { 
    $("#quickform").validate({ 
     rules: { 
      name: { 
       required: true 
      }, 
      phone: { 
       required: true, 
       phoneUK: true //or look at the additional-methods.js to see available phone validations 
      }, 
      email: { 
       required: true, 
       email: true 
      }, 
      enquiry: { 
       required: true 
      } 

     }, 
     messages: { 
      name: { 
       required: "Please enter your name."       
      }, 
      phone: { 
       required: "Please enter your phone number."       
      }, 
      email: { 
       required: "Please enter your email address."       
      }, 
      enquiry: { 
       required: "Please enter your enquiry."       
      } 
     }, 
    }); 

}); 
</script> 

Answer 2

我建議建立一個正則表達式和匹配到了用戶輸入，並使用匹配（）函數。

有關如何構建正確的正則表達式的詳細信息（根據您所在地區）去RegExp tutorial。

Answer 3

我有英國的電話號碼驗證

jQuery.validator.addMethod('phoneUK', function(phone_number, element) { 
         phone_number = phone_number.replace(/\s+/g, ''); 
         return this.optional(element) || phone_number.match(/^(\+44\s?7\d{3}|\(?07\d{3}\)?)\s?\d{3}\s?\d{3}$/); 
        }, 'Please specify a valid phone number'); 


        $('#inputTelephone').rules('add', { 
         required: true, 
         phoneUK: true 
        });