当使用 jQuery Validation 插件验证 Bootstrap 输入框组的时候,提示的错误信息会导致输入框组错位,具体如图:

解决方法就是通过 errorPlacement 方法去重新设置错误信息的显示位置,具体代码如下:
$.validator.setDefaults({ highlight: function(element) { $(element).closest('.form-group').addClass('has-error'); }, unhighlight: function(element) { $(element).closest('.form-group').removeClass('has-error'); }, errorElement: 'span', errorClass: 'help-block', errorPlacement: function(error, element) { if(element.parent('.input-group').length) { error.insertAfter(element.parent()); } else { error.insertAfter(element); } } });
解决后的错误提示截图:

声明:1、本博客不从事任何主机及服务器租赁业务,不参与任何交易,也绝非中介。博客内容仅记录博主个人感兴趣的服务器测评结果及一些服务器相关的优惠活动,信息均摘自网络或来自服务商主动提供;所以对本博客提及的内容不作直接、间接、法定、约定的保证,博客内容也不具备任何参考价值及引导作用,访问者需自行甄别。2、访问本博客请务必遵守有关互联网的相关法律、规定与规则;不能利用本博客所提及的内容从事任何违法、违规操作;否则造成的一切后果由访问者自行承担。3、未成年人及不能独立承担法律责任的个人及群体请勿访问本博客。4、一旦您访问本博客,即表示您已经知晓并接受了以上声明通告。







