1、设置多tab页同时校验:

$("form").validate({ignore: ":hidden", ignore: ""});

由于使用多tab页时,会存在隐藏域,jquery validate默认是不对隐藏域校验的;以上参数便是加入对隐藏域的校验。

2、多tab页校验,会存在校验提示定位问题,即如果多个tab页同时有不满足校验时,如何实现自动跳转到不满足校验的tab页。思路:根据第一个不满足校验条件的元素所在tab页,查找其在所有tab中的排序位置,然后模拟对应位置的tab点击事件,参考代码:

$("form").validate({ignore: ":hidden",

           ignore: "",
             showErrors: function(errorMap,errorList) {

          //此方法处理所有不满足校验的元素
             var i = 0;
             for(var key in errorMap){
                //alert("属性:" + key + ",值:"+ errorMap[key]); 
                if(i == 0){

                // 所有tab页的内容域

                var conents =  $("div.tab_tontent > div");

                // 所有tab页头

                var tabs = $("div.tab_menu ul li");       
                    var index = conents.index(conents.has("[name='"+key+"']"));
                    tabs.eq(index).click();
                }
                i++;
             }
             this.defaultShowErrors();
            }

          });

  以上是在实际项目中使用jquery validate.js遇到的问题和处理方法,特别提醒下errorMap中存的是不满足校验的元素name和校验提示信息的键值对,为了更好的定位多tab页,各个元素的name要求尽量不相同。

jquery validate 之多tab页同时校验问题的更多相关文章

  1. 使用JQuery.Validate插件来校验页面表单有效性

    使用JQuery.Validate插件来校验页面表单有效性​1. [代码] 常见的注册表单元素 <form action="#" method="post" ...

  2. 利用jquery写的一个TAB页切换效果

    函数如下 /** *切换效果 */ function switab(tab,con,tab_c_css,tab_n_css,no) { $(tab).each(function(i){ if(i == ...

  3. 使用CSS和jQuery实现tab页

    使用jquery来操作DOM是极大的方便和简单,这儿只是简单的用一个使用css和jquery来实现的tab页来简单介绍一些jQuery的一些方便使用的方法,下面是html文件: <!DOCTYP ...

  4. jquery实现tab页切换显示div

    1.jQuery实现tab切换显示代码实现 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &q ...

  5. 使用原生js与jQuery分别实现一个简单的tab页签

    tab页签通常适用于空间有限而内容较多同时兼顾页面美观度不给用户一种信息过量视觉疲劳的情形.使用面非常广,下面我们用两种方法简单实现之. 首先,构建页面元素.页签的可点击部分我们通常用列表来承载,包括 ...

  6. JQuery动态添加多个tab页标签

    jQuery是一个兼容多浏览器的js库,核心理念是write less,do more(写的更少,做的更多),jQuery使用户能更方便地处理HTML documents.events.实现动画效果, ...

  7. Bootstrap 基于Bootstrap和JQuery实现动态打开和关闭tab页

    基于Bootstrap和JQuery实现动态打开和关闭tab页   by:授客 QQ:1033553122 1.   测试环境 JQuery-3.2.1.min.j Bootstrap-3.3.7-d ...

  8. jquery easyui 中tab页添加其他页面,href与content的用法与区别

    //tab页增加 function addPanel(name,url){ var dd = $('#tt').tabs('exists',name); if(dd){ $('#tt').tabs(' ...

  9. JQuery实现tab页

    用ul 和 div 配合实现tab 页 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="U ...

随机推荐

  1. 尝试了一些时间,最简单的apache上设置用IP访问一个虚拟目录

    就是其实新建一个 多域名访问的设置 <VirtualHost *:80> DocumentRoot /var/www/ ServerName IP</VirtualHost> ...

  2. Redis 在 LINUX 系统下 安装, 启动

    01, 下载  http://www.redis.cn/ ,  这里下再下来的是 redis-4.0.1.tar.gz 这个压缩包 02, 将压缩包放到 linux 系统中,  一般放在 usr/lo ...

  3. redis详解(二)-- 数据类型详解

    Redis常用数据类型详解 1,Redis最为常用的数据类型主要有以下: String Hash List Set Sorted set pub/sub Transactions 在具体描述这几种数据 ...

  4. 【转】Ultra simple ISO-7816 Interface

    原文出自 http://hilbert-space.de/?p=135 While laying out a PCB for my SWP reader project I realized that ...

  5. sendkeys

    1)为了指定单一键盘字符,必须按字符本身的键.例如,为了表示字母 A,可以用 "A" 作为 string.为了表示多个字符,就必须在字符后面直接加上另一个字符.例如,要表示 A.B ...

  6. time 时间内置模块3种形态的转化

    import time print(time.time())  #获得时间戳 1526998642.877814 print(time.sleep(2))  #停止2秒 print(time.gmti ...

  7. Error 2503 and 2502 when installing/uninstalling on Windows 10

    1. Hold Ctrl+Shift and press Esc. 2. Locate “Windows Explorer” under “Windows processes”, now right ...

  8. python中index()、find()方法

    index() 方法检测字符串中是否包含子字符串 str ,如果指定 beg(开始) 和 end(结束) 范围,则检查是否包含在指定范围内,该方法与 python find()方法一样,只不过如果st ...

  9. springboot+jsp 遇到的坑

    springboot  使用jsp: 1,修改配置文件, spring: mvc: view: prefix: /WEB-INF/jsp/ suffix: .jsp 2,pom 加入: <dep ...

  10. js函数中变量声明提前

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...