jquery validate 实现动态增加/删除验证规则操作示例


Posted in jQuery onOctober 28, 2019

本文实例讲述了jquery validate 实现动态增加/删除验证规则操作。分享给大家供大家参考,具体如下:

页面加载完成初始化form validate 

$("#user_regForm").validate({
      errorPlacement: function(error, element){
        if(element.attr("id")=="province"||element.attr("id")=="city"||element.attr("id")=="area"){
          var error_td = element.parent().parent('dd').next();
        }else{
          var error_td = element.parent('dd').next();
        }
        error_td.html("");
        error_td.append(error);
        element.addClass("user_regNok");
      },
      error:function(label,element){
        element.addClass("user_regNok");
      },
      success    : function(label,element){
        label.addClass('reg_validate_right').text('');
        element.removeClass("user_regNok");
      },
      submitHandler:function(form){
        console.info("submit:"+$(form).serializeArray());
        form.submit(); 
      },
      onkeyup: false,
      rules : {
        username:{
          required:true,
          alipay:true,
          remote  : {
            url :'index.php?mod=ajax&act=check_user',
            type:'post',
            data:{
              username : function(){
                return $('#username').val();
              }
            }
          }
        },
        password : {
          required : true,
          rangelength:[6,20]
        },
        password_confirm : {
          required : true,
          equalTo : '#password'
        },
        captcha:{
          required : true,
          maxlength:4,
          remote  : {
            url :'index.php?mod=ajax&act=check_captcha',
            type:'post'
          }
        }
      },
      messages : {
        username:{
          alipay:"输入电子邮箱或手机号码",
          remote:"用户名已存在"
        },
        password : {
          required : '您必须提供一个密码',
          rangelength: '密码长度应在6-20个字符之间'
        },
        password_confirm : {
          required : '您必须再次确认您的密码',
          equalTo : '两次输入的密码不一致'
        },
        captcha:{
          required : "请输入验证码",
          maxlength:"输入4位验证码",
          remote:"验证码错误"
        }
      }
    });

后期比如像增加某些表单的验证规则

var add_user_validate=function(){
    console.info("add_user_validate");
    remove_user_validate();
    $("#province").rules("add",{required:true,min:0,messages:{min:"请选择省份"}});
    $("#city").rules("add",{required:true,min:0,messages:{min:"请选择城市"}});
    $("#area").rules("add",{required:true,min:0,messages:{ min:"请选择区域"}});
    $("#sjhztype").rules("add",{required:true,min:0,messages:{ min:"请选择合作类型"}});
    $("#realname").rules("add",{required:true});
    $("#tel").rules("add",{required:true,mobile:0});
    $("#shopname").rules("add",{required:true});
  }

后来又因为什么原因不详以上元素需要验证

可以删除规则

var remove_user_validate=function(){
    console.info("remove_user_validate");
    $("#province").rules("remove");
    $("#city").rules("remove");
    $("#area").rules("remove");
    $("#sjhztype").rules("remove");
    $("#realname").rules("remove");
    $("#tel").rules("remove");
    $("#shopname").rules("remove");
  }

ok!!

希望本文所述对大家jQuery程序设计有所帮助。

jQuery 相关文章推荐
jQuery复合事件用法示例
Jun 10 jQuery
jQuery实现动态给table赋值的方法示例
Jul 04 jQuery
jQuery实现对网页节点的增删改查功能示例
Sep 18 jQuery
基于jquery trigger函数无法触发a标签的两种解决方法
Jan 06 jQuery
jQuery发请求传输中文参数乱码问题的解决方案
May 22 jQuery
jQuery轻量级表单模型验证插件
Oct 15 jQuery
jQuery中实现text()的方法
Apr 04 jQuery
jquery登录的异步验证操作示例
May 09 jQuery
如何使用CSS3+JQuery实现悬浮墙式菜单
Jun 18 jQuery
jquery css实现流程进度条
Mar 26 jQuery
JavaScript或jQuery 获取option value值方法解析
May 12 jQuery
jQuery实现动态操作table行
Nov 23 jQuery
javascript(基于jQuery)实现鼠标获取选中的文字示例【测试可用】
Oct 26 #jQuery
jquery实现购物车基本功能
Oct 25 #jQuery
使用jQuery实现掷骰子游戏
Oct 24 #jQuery
jquery实现掷骰子小游戏
Oct 24 #jQuery
jquery 键盘事件 keypress() keydown() keyup()用法总结
Oct 23 #jQuery
jQuery实现轮播图源码
Oct 23 #jQuery
jQuery实现图片随机切换、抽奖功能(实例代码)
Oct 23 #jQuery
You might like
php正则表达式使用的详细介绍
2013/04/27 PHP
深入理解:单一入口、MVC、ORM、CURD、ActiveRecord概念
2013/06/06 PHP
PHP CURL post数据报错 failed creating formpost data
2016/10/16 PHP
解决laravel查询构造器中的别名问题
2019/10/17 PHP
Laravel jwt 多表(多用户端)验证隔离的实现
2019/12/18 PHP
php判断数组是否为空的实例方法
2020/05/10 PHP
Laravel 自动转换长整型雪花 ID 为字符串的实现
2020/10/27 PHP
S2SH整合JQuery+Ajax实现登录验证功能实现代码
2013/01/30 Javascript
jQuery 计算iframe 窗口大小的方法
2014/05/13 Javascript
JQuery动态添加和删除表格行的方法
2015/03/09 Javascript
javascript 闭包详解
2015/07/02 Javascript
jQuery购物网页经典制作案例
2016/08/19 Javascript
JS批量替换内容中关键词为超链接
2017/02/20 Javascript
vue-loader教程介绍
2017/06/14 Javascript
使用vue构建一个上传图片表单
2017/07/04 Javascript
解决vue多个路由共用一个页面的问题
2018/03/12 Javascript
thinkjs微信中控之微信鉴权登陆的实现代码
2019/08/08 Javascript
layui实现根据table数据判断按钮显示情况的方法
2019/09/26 Javascript
Python修改MP3文件的方法
2015/06/15 Python
Python装饰器实现几类验证功能做法实例
2017/05/18 Python
python运行其他程序的实现方法
2017/07/14 Python
tensorflow实现简单的卷积网络
2018/05/24 Python
带你彻底搞懂python操作mysql数据库(cursor游标讲解)
2020/01/06 Python
PyCharm无法引用自身项目解决方式
2020/02/12 Python
浅谈keras中的keras.utils.to_categorical用法
2020/07/02 Python
python上下文管理器异常问题解决方法
2021/02/07 Python
html5 canvas 画图教程案例分析
2012/11/23 HTML / CSS
Zavvi荷兰:英国大型音像制品和图书游戏零售商
2018/03/22 全球购物
美国正版电视节目和电影在线观看:Hulu
2018/05/24 全球购物
最好的商品表达自己:Cafepress
2019/09/04 全球购物
教师群众路线剖析材料
2014/09/29 职场文书
党员民主评议总结
2014/10/20 职场文书
2015人事行政工作总结范文
2015/05/21 职场文书
家长会主持词开场白
2015/05/29 职场文书
合同补充协议书
2016/03/24 职场文书
Python机器学习之KNN近邻算法
2021/05/14 Python