如何在jquery中使用多个正则表达式?

时间:2014-02-18 16:12:19

标签: javascript jquery regex

我想使用正则表达式在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;
    });

我所尝试的一切都没有用。 所以请帮帮我。 谢谢。

2 个答案:

答案 0 :(得分:0)

正确的语法是

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

不是

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

实际上,如果你只是想知道匹配是否成功,你应该使用test而不是match

答案 1 :(得分:0)

问题在于您的正则表达式模式,它确实验证了邮件。

使用此模式验证您的电子邮件地址。

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