如何在带有defaultValue的可选字段上使用jQuery验证器自定义方法?
我使用的是jQuery(1.6.2)的最新版本 在电话号码的可选字段中,我有一个如何在带有defaultValue的可选字段上使用jQuery验证器自定义方法?,jquery,methods,jquery-validate,default-value,Jquery,Methods,Jquery Validate,Default Value,我使用的是jQuery(1.6.2)的最新版本 在电话号码的可选字段中,我有一个defaultValue HTML: <input type="text" class="autoclear blur" value="your telephone number" name="Phone" /> $(document).ready(function() { var nameMsg = "Please enter your full name.", emailM
defaultValue
HTML:
<input type="text" class="autoclear blur" value="your telephone number" name="Phone" />
$(document).ready(function() {
var nameMsg = "Please enter your full name.",
emailMsg = "Please enter your email address.",
emailMsgV = "This is not a valid email address.",
commentsMsg = "Please enter your comments.";
$.validator.addMethod('phone', function (value, element) {
return this.optional(element) || /^[01]?[- .]?\(?[2-9]\d{2}\)?[- .]?\d{3}[- .]?\d{4}$/.test(value);
}, 'This is not a valid number.');
$('#contactForm').validate({
onkeyup: false,
validClass: 'valid',
rules: {
Name: {
required: true
},
email: {
required: true,
email: true
},
Phone: {
required: false,
phone: true
},
Comments: {
required: true
}
},
messages: {
Name: nameMsg,
email: {
defaultInvalid: emailMsg,
required: emailMsg,
email: emailMsgV
},
Comments: commentsMsg
},
success: function(error) {
setTimeout(function() { // Use a mini timeout to make sure the tooltip is rendred before hiding it
$('#contactForm').find('.valid').qtip('destroy');
}, 1);
},
submitHandler: function(form) {
$('#contactForm .autoclear').each(function() {
if (this.value === this.defaultValue) {
this.value = '';
}
});
form.submit();
},
errorPlacement: function(error, element) {
$(element).filter(':not(.valid)').qtip({
overwrite: false,
content: error,
position: {
my: 'left center',
at: 'right center'
},
show: {
event: false,
ready: true
},
hide: false
}).qtip('option', 'content.text', error);
} // closes errorPlacement
}) // closes validate()
}); // closes document.ready()
问题是,因为我在这个可选字段上有一个defaultValue
,所以它也得到了验证
phone
的自定义方法是否可以编辑为在字段留空时忽略字段上的defaultValue
我试着用if/then
来包围正则表达式,但这似乎不起作用
$.validator.addMethod('phone', function (value, element) {
if (value != element.defaultValue) {
return this.optional(element) || /^[01]?[- .]?\(?[2-9]\d{2}\)?[- .]?\d{3}[- .]?\d{4}$/.test(value);
}
}, 'This is not a valid number');
思考了它的工作原理后,我知道这是错误的方法。。。现在我迷路了。似乎需要从传递给
addMethod
的函数中返回一些内容:
$.validator.addMethod('phone', function (value, element) {
if (value != element.defaultValue) {
return this.optional(element) || /^[01]?[- .]?\(?[2-9]\d{2}\)?[- .]?\d{3}[- .]?\d{4}$/.test(value);
}
return true;
}, 'This is not a valid number');
示例:您看过HTML5占位符属性了吗?显然,如果你不关心旧浏览器,这只是一个解决方案。@AndrewHitaker,这很酷,但这个网站支持IE7。必须有一种方法来修改该正则表达式以传递
defaultValue
,否?这很有效!谢谢大家!!现在对我来说,这似乎也更有意义了。@Sparky672:没问题!实际上,我甚至不知道defaultValue
属性存在,所以谢谢你的提问!我简直不敢相信我没有意识到正则表达式返回的是真/假,而我的if/then
只是完全阻止了它。顺便说一句:是的,“财产”。