解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法


Posted in jQuery onAugust 27, 2019

在使用validate进行表单验证时会有第一次验证通过,但是第二次验证不通过时,第一次验证通过的信息残留在label上面的情况,最常见的就是√残留

如此图所示:

解决jquery validate 验证不通过后验证正确的信息仍残留在label上的方法

此时“请输入姓名”前面应该时×才是正常情况。如何解决这个问题?

需要对jquery.validate.js文件进行修改,原因如下:

一次验证成功但是二次验证失败后,会进入如下代码:

showLabel: function( element, message ) {
      var place, group, errorID,
        error = this.errorsFor( element ),
        elementID = this.idOrName( element ),
        describedBy = $( element ).attr( "aria-describedby" );
      if ( error.length ) {
        // refresh error/success class
        error.removeClass( this.settings.validClass ).addClass( this.settings.errorClass );
        // replace message on existing label
        error.html( message );
      } else {
        // create error element
        error = $( "<" + this.settings.errorElement + ">" )
          .attr( "id", elementID + "-error" )
          .addClass( this.settings.errorClass )
          .html( message || "" );

其中会执行 error.removeClass( this.settings.validClass ) 这个代码,我们找到 validClass 后会发现 validClass: "valid",我们一般会将验证成功的类名设置为“success”,所以我们只需要将validClass: "valid"

改为validClass: "success"就可以消除这个问题

以上就是全部知识点内容,需要的朋友们可以参考下。

jQuery 相关文章推荐
JQuery 进入页面默认给已赋值的复选框打钩
Mar 23 jQuery
jquery实现异步加载图片(懒加载图片一种方式)
Apr 24 jQuery
jquery实现图片上传前本地预览
Apr 28 jQuery
JQuery实现定时刷新功能代码
May 09 jQuery
jQuery为某个div加入行样式
Jun 09 jQuery
jQuery序列化后的表单值转换成Json
Jun 16 jQuery
jQuery 中msgTips 顶部弹窗效果实现代码
Aug 14 jQuery
如何快速解决JS或Jquery ajax异步跨域的问题
Jan 08 jQuery
jQuery实现简单复制json对象和json对象集合操作示例
Jul 09 jQuery
jQuery操作cookie的示例代码
Jun 05 jQuery
jQuery与原生JavaScript选择HTML元素集合用法对比分析
Nov 26 jQuery
jQuery实现评论模块
Aug 19 jQuery
Jquery实现获取子元素的方法分析
Aug 24 #jQuery
jquery分页优化操作实例分析
Aug 23 #jQuery
jquery实现的分页显示功能示例
Aug 23 #jQuery
jQuery表单选择器用法详解
Aug 22 #jQuery
详解webpack引用jquery(第三方模块)的三种办法
Aug 21 #jQuery
jquery树形插件zTree高级使用详解
Aug 16 #jQuery
jQuery zTree树插件的使用教程
Aug 16 #jQuery
You might like
让php处理图片变得简单 基于gb库的图片处理类附实例代码下载
2011/05/17 PHP
php使用PDO操作MySQL数据库实例
2014/12/30 PHP
php通过分类列表产生分类树数组的方法
2015/04/20 PHP
PHP导出带样式的Excel示例代码
2016/08/28 PHP
JQuery动态创建DOM、表单元素的实现代码
2011/08/09 Javascript
JS 两个字符串时间的天数差计算
2013/08/25 Javascript
使用Jquery实现点击文字后变成文本框且可修改
2013/09/21 Javascript
js获取html的span标签的值方法(超简单)
2016/07/26 Javascript
微信小程序-getUserInfo回调的实例详解
2017/10/27 Javascript
基于jquery trigger函数无法触发a标签的两种解决方法
2018/01/06 jQuery
深入浅析javascript函数中with
2018/10/28 Javascript
浅谈vue后台管理系统权限控制思考与实践
2018/12/19 Javascript
bootstrap table实现横向合并与纵向合并
2019/07/18 Javascript
基于js实现逐步显示文字输出代码实例
2020/04/02 Javascript
用Python编写一个基于终端的实现翻译的脚本
2015/04/24 Python
Python3实现的字典、列表和json对象互转功能示例
2018/05/22 Python
Python寻找两个有序数组的中位数实例详解
2018/12/05 Python
用Python实现大文本文件切割的方法
2019/01/12 Python
Python实现二叉树的常见遍历操作总结【7种方法】
2019/03/06 Python
Numpy数组array和矩阵matrix转换方法
2019/08/05 Python
pandas 对group进行聚合的例子
2019/12/27 Python
详解python的变量缓存机制
2021/01/24 Python
python中pyqtgraph知识点总结
2021/01/26 Python
肯尼亚网上商城:Kilimall
2016/08/20 全球购物
内业资料员岗位职责
2014/01/04 职场文书
优秀中学生事迹材料
2014/01/31 职场文书
《再别康桥》教学反思
2014/02/12 职场文书
小学生新年寄语
2014/04/03 职场文书
小学班主任评语大全
2014/04/23 职场文书
2015年质量月活动总结报告
2015/03/27 职场文书
公司出差管理制度范本
2015/08/05 职场文书
MySQL 慢查询日志深入理解
2021/04/22 MySQL
Javascript 解构赋值详情
2021/11/17 Javascript
javascript的var与let,const之间的区别详解
2022/02/18 Javascript
win11高清晰音频管理器在哪里?win11找不到高清晰音频管理器解决办法
2022/04/08 数码科技
PHP面试题 wakeup魔法 Ezpop pop序列化与反序列化
2022/04/11 PHP