我已经研究了好几个小时了,而且我束手无策。我在同一页面上有两个表单,它们都使用 jQuery 验证在提交之前确认有效数据。
编辑:
包括下面的代码。
两件事情:
出于某种原因,正在验证第一个表格(注册表),因为我正在输入数据。因此,它似乎在 keyup/blur 事件上触发,但是当我单击提交按钮时没有正确触发。如您所见,它允许使用空或无效数据提交表单。
右侧的登录表单。有用!但我需要单击提交按钮两次才能实际提交表单。
这里满是头发。拜托,有人能帮忙解决这个问题吗?
编辑:
根据要求在此处添加代码。一、注册验证器:
<script type="text/javascript">
$(document).ready(function() {
$.validator.addMethod("PASSWORD",function(value,element){
return this.optional(element) || /^(?=.*\d)(?=.*[a-zA-Z]).{5,}$/i.test(value);
},"Your password must be at least 5 characters long. Please include 1 or more numbers.");
$.validator.addMethod("lettersnumbers", function(value,element) {
return this.optional(element) || /^[a-zA-Z0-9]+$/i.test(value);
}, "Username can only contain letters and numbers. No spaces are allowed.");
$.validator.addMethod("BIRTH",function(value,element){
var age = 18;
switch($('#Province option:selected').val())
{
case "NB":
case "BC":
case "NL":
case "NS":
case "NY":
case "YT":
case "NU":
case "AL":
case "DE":
case "NE":
case "NV":
case "OH":
case "TN":
case "UT":
case "VA":
case "WI":
age = 19;
break;
case "MS":
age = 21;
break;
}
if (new Date().getFullYear() - year <= age)
{
return false;
}
return true;
},"In order to be eligible to Register, you must have reached the age of majority in your Province, Territory, or County of residence.");
var validator = $("#signupForm").validate({
rules: {
Captcha: {
required: true,
remote: {
url: "/js/validate_captcha.php",
type: "post",
data: {
action: function () {
return "checkcaptcha";
},
username: function() {
var Captcha = $("#Captcha").val();
return Captcha;
}
}
}
},
Password: "required PASSWORD",
PasswordConfirm: {
required: true,
minlength: 5,
equalTo: "#Password"
},
Username: {
required: true,
lettersnumbers: true,
maxlength: 18,
remote: {
url: "/js/validate_username.php",
type: "post",
data: {
action: function () {
return "checkusername";
},
username: function() {
var Username = $("#Username").val();
return Username;
}
}
}
},
Country: "required",
FirstName: "required",
LastName: "required",
Email: {
required: true,
remote: {
url: "/js/validate_email.php",
type: "post",
data: {
action: function () {
return "checkemail";
},
username: function() {
var Email = $("#Email").val();
return Email;
}
}
},
email: true
},
EmailConfirm: {
required: true,
email: true,
equalTo: "#Email"
},
BirthDate: {
required: true,
BIRTH: true
},
Agreement: "required",
AgeCheck: "required",
},
messages: {
captcha: "CAPTCHA response is required" ,
Agreement: "You must agree by checking the box" ,
AgeCheck: "You must agree by checking the box" ,
EmailConfirm: "Email Addresses do not Match",
lettersnumbers: "Username can only contain letters and numbers. No spaces allowed.",
noSpace: "Username cannot have spaces",
PasswordConfirm: "Please re-enter the same password as above",
Username:{
remote: "This username is already taken. Try another.",
maxlength: "Username may not be longer than 18 characters."
},
Captcha:{
remote: "You have entered an incorrect CAPTCHA response."
},
Email:{
remote: "This e-mail is already taken. Try another."
},
Password: {
required: "Please provide a password",
minlength: "Your password must be at least 5 characters long. Please include 1 or more numbers." },
required: "Required Field" ,
},
});
});
</script>
现在,登录验证器:
<script type="text/javascript">
$(document).ready(function() {
var loginvalidator = $("#form_login").validate({
rules: {
LoginUser: {
required: true,
remote: {
url: "/js/validate_login_username.php",
type: "post",
data: {
action: function () {
return "checkusername";
},
username: function() {
var Email = $("#LoginUser").val();
return Email;
}
}
}
},
LoginPassword: "required"
},
messages: {
LoginUser: {
required: "Required Field",
remote: "The username or email entered was not found. Please note, your username must contain only letters and numbers, and never any spaces. Try logging in with your email address instead." },
LoginPassword: {
required: "Required Field",
remote: "Password is incorrect. Please try again." },
},
});
});
</script>