zoukankan      html  css  js  c++  java
  • Nice Jquery Validator 方法

    .validator()

    .validator( options )

    描述:根据参数初始化验证,验证 jQuery 选中的表单

    参数:{Object} options - 可选,参考配置选项

    示例

    $('#form1').validator({
        timely: 2,
        stopOnError: true,
        fields: {
            email: "required;email",
            password: "required;length(6~16)",
            mobile: "required;mobile"
        },
        valid: function(form) {
            $.post("path/to/server", $(form).serialize())
                .done(function(){
                    // some code
                });
        }
    });

    .validator( validCallback )

    描述:初始化验证,验证 jQuery 选中的表单,验证通过后执行回调

    参数:{Function} validCallback - 表单验证通过的回调

    示例

    $('#form1').validator(validCallback);
    // 等同于
    $('#form1').validator({
        valid: validCallback
    });


    .validator( instanceMethod, arg1, arg2... )

    描述:通过.validator() 方法调用实例方法
    参数:{String} instanceMethod - 实例方法名称
    参数:{Arguments} argn - 调用实例方法时的参数

    示例

    // 清空表单验证消息
    $('#form1').validator("cleanUp");
    // 销毁表单验证
    $('#form1').validator("destroy");

    .isValid( callback )

    描述:判断某个区域或者某个字段是否验证通过,如果字段中有异步 ajax 验证,需要通过 callback 获取验证结果
    参数: {Function} callback - 回调函数
    示例

    // 使用回调函数获取验证结果
    $('#mobile').isValid(function(v){
        if (v) {
            // do something
        }
    });
    // v0.10.5+ 还支持下面这种写法,即回调不带参数,就是验证通过的回调
    $('#mobile').isValid(function(){
        // do something
    });
    // 如果验证的字段中没有 ajax 异步验证,直接获取结果也是可以的
    if ( $('#mobile').isValid() ) {
        // do something
    } 


    $.validator (静态方法)

    $.validator(selector, options)

    描述:初始化表单。如果 selector 选择的元素存在于 DOM,其等同于 $(selector).validator(options) 这种写法。如果不存在,nice-validator 会 预初始化 该选择器选中的表单,等到该表单存在时就可以直接被验证。

    参数:{jqSelector|Element} selector - jQuery 选择器(支持预初始化),或者 DOM Element
    参数:{Object} options - 参考配置选项
    示例

    // 即使 "#form1" 这个表单被动态加载,也可以验证
    $.validator("#form1", {
        timely: 2,
        stopOnError: true,
        fields: {
            email: "required;email",
            password: "required;length(6~16)",
            mobile: "required;mobile"
        }
    });

    .config(options)

    描述:配置全局选项

    参数:{Object} options - 参考配置选项

    示例

    $.validator.config({
        timely: 2
    });

    .setTheme(name, options)

    描述:配置全局主题
    参数:{String} name - 主题名称
    参数:{Object} options - 参考配置选项
    示例

    $.validator.setTheme("myTheme", {
        formClass: "nice-flat",
        msgClass: "n-right",
        timely: 2,
        stopOnError: true
    });


    instance (实例方法)

    实例方法需要获取对象实例,才能调用。

    验证初始化的时候会自动初始实例,通过 $form.data('validator') 可以获取到实例

    .test(elem, rule)

    描述:验证字段是否符合指定的规则
    参数:{Element} elem - DOM 元素
    参数:{String} rule - 规则
    返回:{Boolean}
    示例

    $("#myForm").validator({
        rules: {
            loginName: function(element) {
                return /^[a-zA-Z]w{3,}/.test(element.value)
                       || this.test(element, "mobile")
                       || this.test(element, "email")
                       || 'Please fill user name, phone number or E-mail';
            }
        },
        fields: {
            username: "required; loginName",
            password: "required; length(6~16)"
        }
    });

    .setField()

    .setField(key, field)

    描述:动态配置字段参数
    参数:{String} key - 字段 name 或者 #id
    参数:{Object} field - 字段参数
    示例

    $('form').validator("setField", "username", "required;");
    // Remove the field's verification.
    $('form').validator("setField", "username", null);


    .setField(obj)

    描述:动态配置字段参数
    参数:{Object} obj - 字段参数 Hash
    示例

    $('form').validator("setField", {
        username: "required;username",
        pwd: "required;password"
    });

    .holdSubmit(hold)

    描述:防止表单重复提交的措施
    参数:{Boolean} hold - 是否控制表单提交
    示例

    $("#myForm").validator({
        valid: function(form){
            var me = this;
            // Before submitting the form, hold form, to prevent duplicate submission.
            me.holdSubmit();
            $.ajax({
                url: "xxx.php",
                data: $(form).serialize(),
                type: "POST",
                success: function(){
                    // After the form is submitted successfully, release hold.
                    me.holdSubmit(false);
                }
            });
        }
    });

    .cleanUp()

    描述:清除表单中的全部验证消息

    示例

    $('#form1').validator('cleanUp');

    .destroy()

    描述:销毁表单验证实例

    示例

    $('#form1').validator('destroy');
  • 相关阅读:
    Mybatis Plus 代码生成器
    Vue中 scss不支持/deep/写法问题
    学习过程中看到的网站收藏
    mysql数据库的安装配置
    element表格样式修改
    vue甘特图gantt
    一个CSS动画生成工具,可自由配置各种动画特效,并自动生成代码
    《TypeScript 入门教程》全面介绍了 TypeScript 强大的类型系统,完整而简洁,示例丰富,比官方文档更易读,非常适合作为初学者学习 TypeScript 的第一本书 —— 阮一峰
    程序员文档编辑器 Markdown
    Svn(小乌龟)的基本操作使用
  • 原文地址:https://www.cnblogs.com/feixiablog/p/8990467.html
Copyright © 2011-2022 走看看