jQuery 验证将类添加到错误元素?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9929418/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery validate add class to error element?
提问by redconservatory
I have the following code using jQuery Validate.
我有以下使用 jQuery 验证的代码。
$("#register").validate({
debug: true,
errorClass:'error',
validClass:'success',
errorElement:'span',
highlight: function (element, errorClass, validClass) {
$(element).parents("div.control-group")
.addClass(errorClass)
.removeClass(validClass);
},
unhighlight: function (element, errorClass, validClass) {
$(element).parents(".error")
.removeClass(errorClass)
.addClass(validClass);
}
});
Is there a way to add a class to the errorElement, 'span' so that it's...:
有没有办法将一个类添加到 errorElement, 'span' 以便它是...:
<span class="help-inline error">Message</span>
回答by Ryley
When you specify the errorClass
, there's nothing stopping you from making it two things: "help-inline error", i.e.:
当您指定 时errorClass
,没有什么可以阻止您做两件事:“帮助内联错误”,即:
$("#register").validate({
debug: true,
errorClass: 'error help-inline',
validClass: 'success',
errorElement: 'span',
highlight: function(element, errorClass, validClass) {
$(element).parents("div.control-group").addClass(errorClass).removeClass(validClass);
},
unhighlight: function(element, errorClass, validClass) {
$(element).parents(".error").removeClass(errorClass).addClass(validClass);
}
});
Note that you have to use version 1.10 of jQuery Validate to support this. Earlier versions only allow one errorClass
.
请注意,您必须使用 jQuery Validate 1.10 版来支持此功能。早期版本只允许一个errorClass
.
回答by pdorgambide
An alternative of Ryley answer that not include the 'help-inline' into 'control-group' that avoid input offset on highlight.
Ryley 答案的另一种选择,不将“帮助内联”包含到“控制组”中,以避免突出显示输入偏移。
$("#register").validate({
debug: true,
errorClass: 'error help-inline',
validClass: 'success',
errorElement: 'span',
highlight: function(element, errorClass, validClass) {
$(element).parents("div.control-group").addClass('error').removeClass('success');
},
unhighlight: function(element, errorClass, validClass) {
$(element).parents(".error").removeClass('error').addClass('success');
}
});
I cound't to include that issue like a comment of the answer...;o(,.
我不能像对答案的评论一样包含这个问题...;o(,.
回答by Santiago
Because I think this is for Twitter Booststrap, this is a better solution with no need to update jquery validation:
因为我认为这是针对 Twitter Booststrap 的,所以这是一个更好的解决方案,无需更新 jquery 验证:
$("#register").validate({
debug: true,
errorClass: 'help-inline',
validClass: 'success',
errorElement: 'span',
highlight: function(element, errorClass, validClass) {
$(element).parents("div.control-group").addClass("error");
},
unhighlight: function(element, errorClass, validClass) {
$(element).parents(".error").removeClass("error");
}
});
回答by joehand
$(".error").addClass('help-inline')
will add the help-inline
class to all DOM elements with the error
class already.
将help-inline
类添加到所有具有error
该类的DOM 元素。
Is that what you are looking for?
这就是你要找的吗?