前端技术 手机教程
程序开发 平面动画
系统软件 CMS教程
CMS教程 在线手册
资源下载 网络安全
精准搜索请尝试:精确搜索

jQuery Validation验证Bootstrap的输入框组(input-group)时提示信息错位的解决办法

2019-11-26 15:57:06 来源:原创 作者:寂静的神经

当使用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);
      }
  }
});

解决后的错误提示截图:

相关文章

零五网,分享IT知识,国内顶级IT知识门户网站。

Copyright (C) www.02405.com, All Rights Reserved.

零五网 版权所有 辽ICP备13002105号-1