代码:
$(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语句并点击按钮时,它显示我输入你的名字后输入名称,当我再次点击按钮时它会显示相同的消息。那么,我该如何解决这个问题呢?请帮帮我。
谢谢
答案 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();