如何在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){

要么

else if(!email.match(emailPattern))

演示