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

转载  更新时间:2017年05月18日 14:04:32   作者:翟鳳璽   我要评论

这篇文章主要介绍了jQuery Validate 校验多个相同name的方法,需要的朋友可以参考下

导读:

在表单页中有如下代码

 <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实现隔行背景色变色

    这篇文章给大家分享了jQuery实现隔行背景色变色的代码,有相同需要的小伙伴参考下吧
    2014-11-11
  • 基于jquery二维码生成插件qrcode

    基于jquery二维码生成插件qrcode

    这篇文章主要为大家详细介绍了基于jquery二维码生成插件qrcode的相关资料,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-01-01
  • 收集的10个免费的jQuery相册

    收集的10个免费的jQuery相册

    或许在网络上你已经见过数百种通过jQuery实现的相册,但是我们发现的这些相册,他们有额外的东西,优雅和独特的创意!每个相册都是可在线预览和免费下载的。你可以为你的Web项目添加色彩。
    2011-02-02
  • 利用JQuery操作iframe父页面、子页面的元素和方法汇总

    利用JQuery操作iframe父页面、子页面的元素和方法汇总

    这篇文章主要给大家介绍了关于利用JQuery操作iframe父页面、子页面的元素和方法的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧。
    2017-09-09
  • 制作jquery遮罩层效果导航菜单代码分享

    制作jquery遮罩层效果导航菜单代码分享

    我们将创建一个简单的jquery菜单,只要我们悬停在导航栏的区域里,将展示给我们的画面是:明亮的菜单在稍显黑暗的背景图中脱颖而出
    2013-12-12
  • 用jQuery实现的模拟下拉框代码

    用jQuery实现的模拟下拉框代码

    用jQuery制作模拟下拉框 浏览器自带的 下拉框样式不好看。在ie6下,下拉框的优先级大于层,经常导致下拉框显示在层的上面。
    2010-03-03
  • JQuery入门——事件切换之toggle()方法应用介绍

    JQuery入门——事件切换之toggle()方法应用介绍

    在toggle()方法中,可以依次调用N个指定的函数,直到最后一个函数,然后重复对这个函数轮番调用,在函数之间切换调用的时候相当的方便,接下来将会详细介绍toggle()方法的使用,感兴趣的你可不要错过了啊
    2013-02-02
  • jQuery实现垂直半透明手风琴特效代码分享

    jQuery实现垂直半透明手风琴特效代码分享

    这是一款jquery hover抽屉式导航图片展开收缩切换特效代码,用户还可以自定义对应幻灯片的标题与文字说明,是一款非常实用的幻灯片特效源码。
    2015-08-08
  • 快速学习jQuery插件 jquery.validate.js表单验证插件使用方法

    快速学习jQuery插件 jquery.validate.js表单验证插件使用方法

    快速学习jQuery插件中的jquery.validate.js表单验证插件使用方法,Validation是历史最悠久的jQuery插件之一,经过了全球范围内不同项目的验证,并得到了许多Web开发者的好评,感兴趣的小伙伴们可以参考一下
    2015-12-12
  • 使用jQuery制作浮动工具栏的实例分享

    使用jQuery制作浮动工具栏的实例分享

    这里所说的浮动工具栏就是大家平时看到的社交网络分享按钮栏那样的效果,可以做成浮动效果且能上下移动,这里我们就来看一个使用jQuery制作页面工具边栏的实例分享.
    2016-05-05

最新评论