jQuery验证无效

时间:2017-11-13 10:00:28

标签: jquery

代码:

        $(document).ready(function(){
           $("#insert").click(function(event){
               event.preventDefault();
               name = $("#name").val();
               phone = $("#phone").val(); 
               email = $("#email").val();
               message = $("#message").val();
               if(name == '')
               {
                   $(".msg").text("Please enter your name");
               }
               else if (email !== "") {  
                    if (!isValidEmailAddress(email)) {
                        $("msg").show(); 
                        $("#email").focus(); 
                        return false;  
                    }
                } 
           });
        });
                function isValidEmailAddress(emailAddress) {
            var pattern = new RegExp(/^(("[\w-+\s]+")|([\w-+]+(?:\.[\w-+]+)*)|("[\w-+\s]+")([\w-+]+(?:\.[\w-+]+)*))(@((?:[\w-+]+\.)*\w[\w-+]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][\d]\.|1[\d]{2}\.|[\d]{1,2}\.))((25[0-5]|2[0-4][\d]|1[\d]{2}|[\d]{1,2})\.){2}(25[0-5]|2[0-4][\d]|1[\d]{2}|[\d]{1,2})\]?$)/i);
            return pattern.test(emailAddress);
        };
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="post">
		<input class="form-control1" id="name" name="name" placeholder="Enter Your Name" type="text">
		<input class="form-control1" id="email" name="email" placeholder="Enter Your Email Id"  type="text">
		<input class="form-control1" id="phone" name="phone" placeholder="Enter Your Phone"  type="text">
		<textarea class="form-control1" name="message" id="message" placeholder="Enter Your Message" ></textarea>
		<input name="insert" id="insert" value="Submit" type="submit">
	</form>

在此代码中,我创建了一个联系人form,并希望使用jQuery验证电话和电子邮件。现在,当我使用If语句并点击按钮时,它显示我输入你的名字后输入名称,当我再次点击按钮时它会显示相同的消息。那么,我该如何解决这个问题呢?请帮帮我。

谢谢

2 个答案:

答案 0 :(得分:1)

尝试使用此alert代替$('.msg')您可以使用.msg,但在您的代码中,我找到了任何 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script> function isValidEmailAddress(emailAddress) { var pattern = new RegExp(/^(("[\w-+\s]+")|([\w-+]+(?:\.[\w-+]+)*)|("[\w-+\s]+")([\w-+]+(?:\.[\w-+]+)*))(@((?:[\w-+]+\.)*\w[\w-+]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][\d]\.|1[\d]{2}\.|[\d]{1,2}\.))((25[0-5]|2[0-4][\d]|1[\d]{2}|[\d]{1,2})\.){2}(25[0-5]|2[0-4][\d]|1[\d]{2}|[\d]{1,2})\]?$)/i); return pattern.test(emailAddress); }; </script> <script> $(document).ready(function(){ $("#insert").click(function(event){ event.preventDefault(); name = $("#name").val(); phone = $("#phone").val(); email = $("#email").val(); message = $("#message").val(); if(name == '') { alert("Please enter your name"); return false; } var filter = /^[0-9+]+$/; if (!filter.test(phone)){ alert("Invalid Phone"); return false; } if (!isValidEmailAddress(email)) { alert("Invalid Email"); $("#email").focus(); return false; } }); }); </script> <form method="post"> <input class="form-control1" id="name" name="name" placeholder="Enter Your Name" type="text"> <input class="form-control1" id="email" name="email" placeholder="Enter Your Email Id" type="text"> <input class="form-control1" id="phone" name="phone" placeholder="Enter Your Phone" type="text"> <textarea class="form-control1" name="message" id="message" placeholder="Enter Your Message" ></textarea> <input name="insert" id="insert" value="Submit" type="submit"> </form> 类元素,因此我使用了警告。

<!-- For 100% page rendering -->

<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- OR
* To lock the zoom of the page -->

<meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 

答案 1 :(得分:0)

if (!isValidEmailAddress(email)) {
       $("msg").show(); 
       $("#email").focus(); 
       return false;  
}

在您的此代码中使用$("msg").show();

更正$(".msg").show();