我在输入文本框中使用带有图标的bootstrap.此输入也有验证.在验证之前,所有内容都在页面上显示正常.验证后,它变得混乱,如下图所示.你能就此提出建议吗?
在验证之前:
验证后:
Feedback">
Feedback">Feedback">
Feedback">Feedback">
Feedback">Feedback">
Feedback">Feedback">
Feedback">Feedback">
Feedback">
jquery代码:
$(document).ready(function() {
$(".registrationForm").validate(
{
rules: {
name : {
required : true,minlength : 3
},surname : {
required : true,username : {
required : true,email : {
required : true,email : true
},password : {
required : true,minlength : 5
},password_again : {
required : true,minlength : 5,equalTo : "#password"
}
},highlight : function(element) {
$(element).closest('.form-group,.has-Feedback').removeClass('has-success').addClass('has-error');
},unhighlight : function(element) {
$(element).closest('.form-group,.has-Feedback').removeClass('has-error').addClass('has-success');
}
}
);
});
谢谢你的帮助.
最佳答案
这是因为您使用的jQuery Validate插件使用< label>默认情况下用于呈现错误消息的标记.
选择将其渲染为< span>标签,它会工作.
原文链接:https://www.f2er.com/html/425538.html选择将其渲染为< span>标签,它会工作.
$(".registrationForm").validate(
{
errorElement: "span"
});
这里的文档:
https://jqueryvalidation.org/validate/
这是一个尝试它的jsfiddle:
https://jsfiddle.net/bq0e5f86/