我正在尝试在我正在创建的网页上运行jQuery验证。我有大约6个不同的字段集,其中包含页面的详细信息。我正在使用它,因为我隐藏并向他们展示提供更好的用户体验。
每当我尝试提交页面时,无论何时添加单个字符(当文本框需要2个或更多字符时),我都可以按照自己的意愿工作,但是我也希望验证能够在onblur上进行。如果他们没有达到验证条件,我想立即通知我的用户,以便他们可以立即修复它,而不必回来。
任何人都可以告诉我我需要做什么我正在使用* http://bassistance.de/jquery-plugins/jquery-plugin-validation/插件。
这是我到目前为止编写的jQuery代码:
$("#aspnetForm").validate({
rules: {
<%=txtFirstName.UniqueID %>:
{
required: true,
minlength: 2
}
,
<%=txtSurname.UniqueID %>:
{
required: true,
minlength: 2
}
,
<%=txtMobileNumber.UniqueID %>:
{
required: true,
minlength: 8
}
,
<%=Email.UniqueID %>:
{
required: true,
email: true
}
,
<%=ddDay.UniqueID %>:
{
required: true
}
,
<%=ddMonth.UniqueID %>:
{
required: true
}
,
<%=ddYear.UniqueID %>:
{
required: true
}
,
<%=txtHouseNumber.UniqueID %>:
{
required: true,
minlength:1
}
,
<%=txtAddress1.UniqueID %>:
{
required: true,
minlength:5
}
,
<%=txtCity.UniqueID %>:
{
required: true,
minlength:2
}
,
<%=txtSuburb.UniqueID %>:
{
required: true,
minlength:2
}
,
<%=txtPostCode.UniqueID %>:
{
required: true,
minlength:4,
maxlength:4
}
,
<%=UserName.UniqueID %>:
{
required: true,
minlength:4
}
,
<%=Password.UniqueID %>:
{
required: true,
minlength:4
}
,
<%=ConfirmPassword.UniqueID %>:
{
equalTo: "ctl00$ctl00$cpMain$cpLeft$Password"
}
,
<%=chkTerms.UniqueID %>:
{
required: true
}
},
messages: {
<%=txtFirstName.UniqueID %>:
{
required: "Please enter your firstname",
minlength: "Minimum length is 2 characters"
},
<%=txtSurname.UniqueID %>:
{
required: "Please enter your lastname",
minlength: "Minimum length is 2 characters"
},
<%=txtMobileNumber.UniqueID %>:
{
required: "Please enter your mobile",
minlength: "Minimum length is 8 characters"
}
,
<%=ddDay.UniqueID %>:
{
required: "Please enter your date of birth"
}
,
<%=txtMobileNumber.UniqueID %>:
{
required: "Please enter your date of birth"
}
,
<%=txtMobileNumber.UniqueID %>:
{
required: "Please enter your date of birth"
}
,
<%=Email.UniqueID %>:
"Please enter a valid email"
,
<%=txtHouseNumber.UniqueID %>:
{
required: "Please enter your house number",
minlength:"Please add at least 1 character"
}
,
<%=txtAddress1.UniqueID %>:
{
required: "Please enter your address",
minlength:"Please add at least 5 characters"
}
,
<%=txtCity.UniqueID %>:
{
required: "Please enter your city",
minlength:"Please add at least 2 characters"
}
,
<%=txtSuburb.UniqueID %>:
{
required: "Please enter your city",
minlength:"Please add at least 2 characters"
}
,
<%=txtPostCode.UniqueID %>:
{
required: "Please enter your postcode",
minlength:"Please add the 4 required characters",
maxlength:"Only 4 characters are allowed"
}
,
<%=UserName.UniqueID %>:
{
required: "Please enter your username",
minlength: "Please add the 4 required characters"
}
,
<%=Password.UniqueID %>:
{
required: "Please enter your password",
minlength: "Please add the 4 required characters"
}
,
<%=ConfirmPassword.UniqueID %>:
{
equalTo: "Passwords must match"
}
,
<%=chkTerms.UniqueID %>:
{
required: "Please agree to the terms"
}
}
});
有什么提示吗?
答案 0 :(得分:51)
$('form').validate({
onfocusout: function (element) {
$(element).valid();
},
rules: {
name: 'required',
from: 'required'
},
messages: {
name: 'Please enter your firstname',
from: 'Please enter where are you from'
}
});
答案 1 :(得分:12)
我无法在docos中看到任何可以做到这一点的内容。我能想到的另一种方式是。
$('#field1, #field2, #field3').blur(function(){
validator.validate()
});
答案 2 :(得分:7)
您还可以使用验证器的元素调用。
$('form').validate({
onfocusout: function(element) {
this.element(element);
},
rules: {
name: 'required',
from: 'required'
},
messages: {
name: 'Please enter your firstname',
from: 'Please enter where are you from'
}
});
答案 3 :(得分:3)
只需设置onkeyup = false
$('form').validate({
rules: {
name: 'required',
from: 'required'
},
onkeyup: false
,
messages: {
name: 'Please enter your firstname',
from: 'Please enter where are you from'
}
});
答案 4 :(得分:0)
Thia代码不会触发验证onkeyup,但是模糊“丢失了 焦点“验证将会激活,一旦用户开始编辑该字段,验证消息将消失。在此ref上找到更有趣的其他自定义: https://jqueryvalidation.org/category/plugin/
$('#frm').validate({
onkeyup: false,
focusCleanup: true
});
答案 5 :(得分:0)
尝试:
onkeyup: function (element, event) {
$(element).valid();
// your code
}