如何在jQuery中使用多個正則表達式？

Question

我想使用正則表達式在jQuery中驗證輸入表單。我使用了第一個正則表達式變量來驗證名字。但我不能使用任何其他正則表達式來驗證下一個輸入變量（lname，email）。當我使用多個正則表達式時，jquery無法正常工作。

這裏是我的HTML代碼

<p>First Name:</p><input type="text" id="fname" placeholder="Enter your first name"> 
    <span class= "error" id= "fnamelabel"></span> 
    <p class="formname">Last Name: </p><input type="text" name="lname" id="lname"class="forms" placeholder="Enter your Last name"> 
    <span class="error" id="lnamelabel"></span> 
    <p class="formname">Address:</p><input type="text" name="address" id="address"class="forms" placeholder="Enter your address name"> 
    <span class="error" id="addresslabel"></span> 
    <p class="formname">Email:</p><input type="text" name="email" id="email"class="forms" placeholder="Enter email address"> 
    <span class="error" id="emaillabel"></span> // four input form 

這裏是我的jQuery代碼

$('document').ready(function(){ 
    $('#sub').click(function() 
        { 
         formvalidation(); 
        }); 
    function formvalidation() 
    { 
     var namef = $('#fname').val(); 
     var namel= $('#lname').val(); 
     var address = $('#address').val(); 
     var email= $('#email').val(); 

     var namexP =/^([a-zA-Z ])*/; 
     //var countryexP= /^([a-zA-Z]+([\s-][a-zA-Z]+)$/; //here i tried to declare a regular expression 
     //var emailxP = /^(\w+([0-9-+.']\w+)*+\@\w+\.([\a-z]{2,3})([.]\w+))$/; 

     ////////validation for first name 
     if(namef=="") 
     { 
      $('#fnamelabel').text('Enter your first name.'); 
      $('#fname').css("border","1px solid red"); 
     } 
     else if(!namexP.test(namef)) 
     { 
      $('#fnamelabel').text("Letters only.") 
      $('#fname').css("border","1px solid red"); 
     } 
     else 
     { 
      $('#fnamelabel').text(''); 
      $('#fname').css("border","default"); 
     } 

     ////////validation for Last name 
     if(namel=="") 
     { 
      $('#lname').css("border","1px solid red"); 
      $('#lnamelabel').text('Please enter your last name name'); 
     } 
     else if(!namexP.test(namel)) 
     { 
      $('#lnamelabel').text("Letters only"); 
      $('#lname').css("border","1px solid red"); 
     } 
     else 
     { 
      $('#lname').css("border","default"); 
      $('#lnamelabel').text(''); 
     } 

     ////////validation for Address 
     if(address == "") 
     { 
      $('#address').css("border","1px solid red"); 
      $('#addresslabel').text('Please enter your address'); 
     } 
     else 
     { 
      $('#address').css("border","default"); 
      $('#addresslabel').text(''); 
     } 

     //namexP= /^([a-zA-Z]+([\s-][a-zA-Z]+)$/; 
     if(email == "") 
     { 
      $('#email').css("border","1px solid red"); 
      $('#emaillabel').text('Please enter your email'); 
     } 
     //here I also tried to direct matching method 
     /*else if(email.!match(/^(\w+([0-9-+.']\w+)*+\@\w+\.([\a-z]{2,3})([.]\w+))/)) 
      { 
      $('#email').css("border","1px solid red"); 
      $('#emaillabel').text('Please enter a valid email address someone@____.com'); 
      }*/ 
     else 
     { 
      $('#email').css("border","default"); 
      $('#emaillabel').text(''); 
     } 
     return false; 
    }); 

所有我曾嘗試不工作。 所以請幫助我。 謝謝。

Answer 1

正確的語法是

if (!email.match(<regexp>)) ... 

不

if (email.!match(<regexp>)) ... 

事實上，喲應該使用test而不是match，如果你只是想知道，如果匹配成功。

Answer 2

問題出在您的正則表達式模式，它確認郵件。

使用此模式驗證您的電子郵件地址。

var emailPattern = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 

，並驗證您的電子郵件一樣

else if(!emailPattern.test(email){ 

OR

else if(!email.match(emailPattern)) 

DEMO