jQuery Validate 校验多个相同name的方法


Posted in jQuery onMay 18, 2017

导读:

在表单页中有如下代码

<form>
  <input name="zhai"/><!-- 三个相同name的input -->
  <input name="zhai"/>
  <input name="zhai"/>
 </form>

jquery validate在对多个相同name校验时,只校验第一个input框。

解决方案一:

在表单页对应的js中加入如下代码 只有当前页可以解决对多个name校验

if ($.validator) {
   $.validator.prototype.elements = function () {
    var validator = this,
     rulesCache = {};
    return $(this.currentForm)
    .find("input, select, textarea")
    .not(":submit, :reset, :image, [disabled]")
    .not(this.settings.ignore)
    .filter(function () {
     if (!this.name && validator.settings.debug && window.console) {
      console.error("%o has no name assigned", this);
     }
     rulesCache[this.name] = true;
     return true;
    });
   }
  }

解决方案二:

修改源文件 所有的页面都可以验证多个name

方式1:修改jquery.validate.js文件

用 ctrl+F 查找 this.name in rulesCache 注释掉如下代码。

elements: function() {
   var validator = this,
    rulesCache = {};
   // select all valid inputs inside the form (no submit or reset buttons)
   return $(this.currentForm)
   .find("input, select, textarea")
   .not(":submit, :reset, :image, [disabled]")
   .not( this.settings.ignore )
   .filter(function() {
    if ( !this.name && validator.settings.debug && window.console ) {
     console.error( "%o has no name assigned", this);
    }
    // 注释掉这里
    // select only the first element for each name, and only those with rules specified
    //if ( this.name in rulesCache || !validator.objectLength($(this).rules()) ) {
    // return false;
    //} 
    rulesCache[this.name] = true;
    return true;
   });
  },

方式2:修改jquery.validate.min.js文件

用 ctrl+F 查找(c[this.name]=!0,!0)})

return !this.name && b.settings.debug && window.console && console.error("%o has no name assigned", this),
//this.name in c || !b.objectLength(a(this).rules()) ? !1 : (c[this.name] = !0, !0)//注释这行
c[this.name] = !0, !0 //添加这行

以上所述是小编给大家介绍的jQuery Validate 校验多个相同name的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

jQuery 相关文章推荐
jQuery Ajax自定义分页组件(jquery.loehpagerv1.0)实例详解
May 01 jQuery
QRCode.js:基于JQuery的生成二维码JS库的使用
Jun 23 jQuery
使用jQuery实现页面定时弹出广告效果
Aug 24 jQuery
jQuery 实现鼠标画框并对框内数据选中的实例代码
Aug 29 jQuery
jquery实现左右轮播图效果
Sep 28 jQuery
jq源码解析之绑在$,jQuery上面的方法(实例讲解)
Oct 13 jQuery
jQuery实现定时隐藏对话框的方法分析
Feb 12 jQuery
jQuery实现表格隔行换色
Sep 01 jQuery
jquery使用FormData实现异步上传文件
Oct 25 jQuery
jQuery实现简单的Ajax调用功能示例
Feb 15 jQuery
浅谈JS和jQuery的区别
Mar 27 jQuery
jQuery实现视频展示效果
May 30 jQuery
jQuery Validate 无法验证 chosen-select元素的解决方法
May 17 #jQuery
jQuery查找dom的几种方法效率详解
May 17 #jQuery
jQuery实现div跟随鼠标移动
Aug 20 #jQuery
jquery+ajax实现省市区三级联动 (封装和不封装两种方式)
May 15 #jQuery
Jquery把获取到的input值转换成json
May 15 #jQuery
jQuery实现radio第一次点击选中第二次点击取消功能
May 15 #jQuery
jQuery返回定位插件详解
May 15 #jQuery
You might like
中篇:安装及配置PHP
2006/12/13 PHP
理解PHP中的stdClass类
2014/04/18 PHP
ThinkPHP模板Volist标签嵌套循环输出多维数组的方法
2016/03/23 PHP
dojo 之基础篇
2007/03/24 Javascript
javascript对象之内置对象Math使用方法
2010/04/16 Javascript
jQuery结合PHP+MySQL实现二级联动下拉列表[实例]
2011/11/15 Javascript
Jquery使用Firefox FireBug插件调试Ajax步骤讲解
2013/12/02 Javascript
jQuery事件用法实例汇总
2014/08/29 Javascript
JS实现超简洁网页title标题跑动闪烁提示效果代码
2015/10/23 Javascript
js判断图片加载完成后获取图片实际宽高的方法
2016/02/25 Javascript
实例讲解jQuery EasyUI tree中state属性慎用
2016/04/01 Javascript
深入理解JS DOM事件机制
2016/08/06 Javascript
初识简单却不失优雅的Vue.js
2016/09/12 Javascript
jQuery 遍历map()方法详解
2016/11/04 Javascript
JS实现数组去重复值的方法示例
2017/02/18 Javascript
利用jquery去掉时光轴头尾部线条的方法实例
2017/06/16 jQuery
vue和webpack打包项目相对路径修改的方法
2018/06/15 Javascript
vue 解决addRoutes动态添加路由后刷新失效问题
2018/07/02 Javascript
npm配置国内镜像资源+淘宝镜像的方法
2018/09/07 Javascript
Vue路由管理器Vue-router的使用方法详解
2020/02/05 Javascript
react ant Design手动设置表单的值操作
2020/10/31 Javascript
[04:49]期待西雅图之战 2016国际邀请赛中国区预选赛WINGS战队赛后采访
2016/06/29 DOTA
django中的HTML控件及参数传递方法
2018/03/20 Python
详解opencv Python特征检测及K-最近邻匹配
2019/01/21 Python
更新pip3与pyttsx3文字语音转换的实现方法
2019/08/08 Python
Python LMDB库的使用示例
2021/02/14 Python
REISS美国官网:伦敦最受欢迎的时尚品牌
2019/08/16 全球购物
数控专业毕业生求职信范文
2013/09/21 职场文书
天猫某品牌专卖店运营计划书
2014/03/21 职场文书
公司合作协议范文
2014/10/01 职场文书
群众路线专项整治方案
2014/10/27 职场文书
2014年党支部工作总结
2014/11/13 职场文书
报名委托书
2015/01/29 职场文书
2015年秘书个人工作总结
2015/04/25 职场文书
css3实现背景图片半透明内容不透明的方法示例
2021/04/13 HTML / CSS
厉害!这是Redis可视化工具最全的横向评测
2021/07/15 Redis