jQuery验证插件

validate()

验证([选项]) 返回: 验证器

描述: 验证选择的形式。

• 验证([选项])

  • 选项
    类型: 对象
    • 调试 (默认值: 假 )
      类型: 布尔
      使调试模式。 如果真的,表单提交和某些错误显示在控制台(将检查是否一个 窗口控制台 属性存在)。 试图使一个表单提交时只是代替验证停止提交。

      例子 :阻止表单提交和试图帮助设置验证警告关于失踪的方法和其他调试信息。

      1 2 3

      $(".selector").validate({ debug: true });

    • submitHandler (默认值: 原生形式提交 )
      类型: 函数 ()
      回调处理实际提交表单时是有效的。 获取表单作为唯一的参数。 替换默认的提交。 正确的地方 通过Ajax提交表单 验证后。

      例子 :通过Ajax提交表单时有效。

      1 2 3 4 5

      $(".selector").validate({ submitHandler: function(form) { $(form).ajaxSubmit(); } });

      例子 :使用submitHandler处理的东西,然后使用默认的提交。 注意,“形式”是指一个DOM元素,这种方式验证不是再次触发。

      1 2 3 4 5 6

      $(".selector").validate({ submitHandler: function(form) { // do other stuff for a valid form form.submit(); } });

      回调函数会被一个参数:

      • 形式
        类型: 元素
        目前正在验证的形式,作为DOMElement。
    • invalidHandler
      类型: 函数 ()
      回调为自定义代码提交表单时无效。 调用事件对象作为第一个参数,验证器作为第二个。

      例子 :显示一条消息,指示在表单上多少字段无效当用户试图提交无效的形式。

      1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

      $(".selector").validate({ invalidHandler: function(event, validator) { // 'this' refers to the form var errors = validator.numberOfInvalids(); if (errors) { var message = errors == 1 ? 'You missed 1 field. It has been highlighted' : 'You missed ' + errors + ' fields. They have been highlighted'; $("div.error span").html(message); $("div.error").show(); } else { $("div.error").hide(); } } });

      回调函数被传递两个参数:

      • 事件
        类型: 事件
        一个自定义事件对象,因为该函数被绑定为一个事件hanlder。
      • 验证器
        类型: 验证器
        validator实例为当前的形式。
    • 忽略 (默认值: ”:隐藏” )
      类型: 选择器
      元素忽视当验证,简单过滤出来。 使用jQuery的不是方法,因此所有接受不()可以通过这个选项。 输入类型提交和重置总是忽视,所以被禁用的元素。

      例子 :忽略所有元素类”忽视“当验证。

      1 2 3

      $("#myform").validate({ ignore: ".ignore" });

    • 规则 (默认值: 规则是读取标记(类、属性数据) )
      类型: 对象
      键/值对定义自定义规则。 关键是一个元素的名称(或一组复选框和单选按钮),值是一个对象组成的规则/参数配对或普通的字符串。 可以结合类/属性/数据规则。 每个规则可以被指定为拥有一个取决于财产适用规则只有在一定的条件下。 看到下面的第二个例子的细节。

      例子 :指定一个名称和电子邮件所需元素作为元素的要求(使用快捷方式为单一规则)和一个有效的电子邮件地址(使用另一个对象文字)。

      1 2 3 4 5 6 7 8 9 10 11

      $(".selector").validate({ rules: { // simple rule, converted to {required:true} name: "required", // compound rule email: { required: true, email: true } } });

      例子 :指定一个接触单元需要的和是电子邮件地址,后者根据复选框检查通过电子邮件联系。

      1 2 3 4 5 6 7 8 9 10 11 12

      $(".selector").validate({ rules: { contact: { required: true, email: { depends: function(element) { return $("#contactform_email:checked") } } } } });

    • 消息 (默认值: 默认消息的方法使用 )
      类型: 对象
      键/值对定义自定义消息。 关键是一个元素的名称,值消息显示为该元素。 而不是一个普通的消息另一个地图与特定的消息对于每个规则可以被使用。 覆盖title属性的元素或默认的消息的方法(按此顺序)。 每个消息可以是一个字符串或一个回调。 调用回调的范围验证器和与规则的参数作为第一和第二arugment元素,它必须返回一个字符串来显示消息。

      例子 :指定一个名称和电子邮件所需元素作为元素需要的和一个有效的电子邮件地址。 一个单一的消息指定名称的元素,和两个消息的电子邮件。

      1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

      $(".selector").validate({ rules: { name: "required", email: { required: true, email: true } }, messages: { name: "Please specify your name", email: { required: "We need your email address to contact you", email: "Your email address must be in the format of name@domain.com" } } });

      例子 :验证名称字段需要的和有至少两个字符。 提供一个回调消息使用jQuery。 格式来避免指定参数在两个地方。

      1 2 3 4 5 6 7 8 9 10 11 12 13 14

      $(".selector").validate({ rules: { name: { required: true, minlength: 2 } }, messages: { name: { required: "We need your email address to contact you", minlength: jQuery.format("At least {0} characters required!") } } });

    • 组
      类型: 对象
      指定分组的错误消息。 一组由一个任意组名称作为键和空格分隔的列表元素名称的值。 使用errorPlacement控制在集团消息被放置。

      例子 :使用一个表的布局形式,将误差messags在下细胞后输入。

      1 2 3 4 5 6 7 8 9 10 11 12

      $("#myform").validate({ groups: { username: "fname lname" }, errorPlacement: function(error, element) { if (element.attr("name") == "fname" || element.attr("name") == "lname" ) { error.insertAfter("#lastname"); } else { error.insertAfter(element); } } });

    • onSubmit (默认值: 真正的 )
      类型: 布尔
      验证表单提交。 设置为假只能使用其他事件进行验证。

      设置为一个函数来决定自己何时运行验证。

      一个布尔真不是一个有效的值。

      例子 :禁用onsubmit验证,允许用户提交任何他想要的,同时还验证在keyup /模糊/点击事件(如果不是另有说明)。

      1 2 3

      $(".selector").validate({ onsubmit: false });

    • onfocusout
      类型: 布尔 或 函数 ()
      验证元素(除复选框和单选按钮)在模糊。 如果没有输入,所有规则都跳过,除非现场已经被标记为无效。

      设置为一个函数来决定自己何时运行验证。

      一个布尔真不是一个有效的值。

      例子 :禁用元素失去焦点时验证。

      1 2 3

      $(".selector").validate({ onfocusout: false });

      回调函数被传递两个参数:

      • 元素
        类型: 元素
        目前正在验证的元素,作为一个DOMElement。
      • 事件
        类型: 事件
        事件对象对于这个focusout事件。
    • onKeyUp
      类型: 布尔 或 函数 ()
      验证元素keyup。 只要现场没有标记为无效的,什么也不会发生。 否则,所有规则检查在每个关键事件。 设置为false来关闭。

      设置为一个函数来决定自己何时运行验证。

      一个布尔真不是一个有效的值。

      例子 :禁用onkeyup验证。

      1 2 3

      $(".selector").validate({ onkeyup: false });

      回调函数被传递两个参数:

      • 元素
        类型: 元素
        目前正在验证的元素,作为一个DOMElement。
      • 事件
        类型: 事件
        事件对象对于这个keyup事件。
    • onClick
      类型: 布尔 或 函数 ()
      验证复选框和单选按钮上单击。 设置为false来关闭。

      设置为一个函数来决定自己何时运行验证。

      一个布尔真不是一个有效的值。

      例子 :禁用onclick验证复选框和单选按钮。

      1 2 3

      $(".selector").validate({ onclick: false });

      回调函数被传递两个参数:

      • 元素
        类型: 元素
        目前正在验证的元素,作为一个DOMElement。
      • 事件
        类型: 事件
        事件对象为这个点击事件。
    • focusInvalid (默认值: 真正的 )
      类型: 布尔
      集中最后活跃或第一无效元素通过validator.focusInvalid提交()。 最后的活跃元素是一个专注当提交表单时,避免偷它的焦点。 如果没有元素集中,第一个在形式得到它,除非这个选项是关闭的。

      例子 :禁用聚焦无效的元素。

      1 2 3

      $(".selector").validate({ focusInvalid: false });

    • focusCleanup (默认值: 假 )
      类型: 布尔
      如果启用,消除了errorClass从无效的元素和隐藏所有错误消息每当元素是集中。 避免focusInvalid结合。

      例子 :使清理当聚焦元素,消除错误类和隐藏的错误消息,当一个元素被集中。

      1 2 3

      $(".selector").validate({ focusCleanup: true });

    • errorClass (默认值: “错误” )
      类型: 字符串
      使用这个类来创建错误标签,寻找现有的错误标签,并将它添加到无效的元素。

      例子 :设置错误类“无效”。

      1 2 3

      $(".selector").validate({ errorClass: "invalid" });

    • validClass (默认值: “有效” )
      类型: 字符串
      这类被添加到一个元素后,验证和认为是有效的。

      例子 :设置有效的类“成功”。

      1 2 3

      $(".selector").validate({ validClass: "success" });

    • errorElement (默认值: “标签” )
      类型: 字符串
      使用这个元素类型创建错误消息和寻找现有的错误消息。 默认,“标签”的优势是创造一个有意义的错误消息之间的联系和无效的字段使用的属性(总是使用,不论该元素类型)。

      例子 :设置错误元素“新兴市场”。

      1 2 3

      $(".selector").validate({ errorElement: "em" });

    • 包装 (默认值: 窗口 )
      类型: 字符串
      包装错误标签指定的元素。 有用的结合errorLabelContainer创建一组错误消息。

      例子 :包装每个错误元素提供了一个列表项,有用当使用有序或无序列表作为误差容器。

      1 2 3

      $(".selector").validate({ wrapper: "li" });

    • errorLabelContainer
      类型: 选择器
      隐藏和显示这个集装箱当验证。

      例子 :所有错误标签显示在一个无序列表ID“对话框”,按照选择器通过errorContainer选项。 所有的错误元素包装在li元素,以创建一个消息的列表。

      1 2 3 4 5

      $("#myform").validate({ errorLabelContainer: "#messageBox", wrapper: "li", submitHandler: function() { alert("Submitted!") } });

    • errorContainer
      类型: 选择器
      隐藏和显示这个集装箱当验证。

      例子 :使用一个额外的容器的错误消息。 给定的元素作为errorContainer都显示和隐藏的错误发生时。 但是自己的错误标签添加到元素(s)作为errorLabelContainer,这里一个无序列表。 因此错误标签也被包装成li元素(包装选项)。

      1 2 3 4 5 6

      $("#myform").validate({ errorContainer: "#messageBox1, #messageBox2", errorLabelContainer: "#messageBox1 ul", wrapper: "li", debug:true, submitHandler: function() { alert("Submitted!") } });

    • showErrors
      类型: 函数 ()
      一个自定义的消息显示处理程序。 获取地图的错误作为第一个参数,和一系列错误作为第二,称为上下文中的validator对象。 这个参数只包含这些元素目前验证,它可以是一个单一的元素做验证onblur / keyup时。 你可以触发(除了你自己的消息)默认行为通过调用this.defaultShowErrors()。

      例子 :更新无效元素的数量每次显示一个错误。 代表们的默认实现实际的错误显示。

      1 2 3 4 5 6 7 8

      $(".selector").validate({ showErrors: function(errorMap, errorList) { $("#summary").html("Your form contains " + this.numberOfInvalids() + " errors, see details below."); this.defaultShowErrors(); } });

      回调函数被传递两个参数:

      • errorMap
        类型: 对象
        键/值对,其中键是指输入字段的名称,值显示的消息的输入。
      • errorList
        类型: 数组
        一个数组元素目前所有验证。 包含对象与下面两个属性:
        • 消息
          类型: 字符串
          该消息被显示为一个输入。
        • 元素
          类型: 元素
          为这个条目的DOMElement。
    • errorPlacement (默认值: 地方的错误标签无效元素之后 )
      类型: 函数 ()
      创建定制的位置错误的标签。 第一个参数:创建的错误标签作为一个jQuery对象。 第二个参数:无效的元素作为一个jQuery对象。

      例子 :使用一个表的布局形式,将误差messags在下细胞后输入。

      1 2 3 4 5

      $("#myform").validate({ errorPlacement: function(error, element) { error.appendTo( element.parent("td").next("td") ); } });

      回调函数被传递两个参数:

      • 误差
        类型: jQuery
        错误标签插入到DOM。
      • 元素
        类型: jQuery
        验证的输入,对于相对定位。
    • 成功
      类型: 字符串 或 函数 ()
      如果指定,错误标签将展示一个有效的元素。 如果一个字符串是给定的,它作为一个类来添加标签。 如果一个函数是给定的,它叫做标签(作为一个jQuery对象)和验证输入(作为一个DOM元素)。 标签可以用来添加一个文本像“好吧!”。

      例子 :添加一个类“有效”,有效的元素,通过CSS样式。

      1 2 3 4

      $("#myform").validate({ success: "valid", submitHandler: function() { alert("Submitted!") } });

      例子 :添加一个类“有效”,有效的元素,通过CSS样式,并添加文本“Ok !”。

      1 2 3 4 5 6

      $("#myform").validate({ success: function(label) { label.addClass("valid").text("Ok!") }, submitHandler: function() { alert("Submitted!") } });

      回调函数被传递两个参数:

      • 标签
        类型: jQuery
        错误的标签。 用于添加一个类或替换文本内容。
      • 元素
        类型: 元素
        目前正在验证的元素,作为一个DOMElement。
    • 突出 (默认值: 添加errorClass(看到选项)的元素 )
      类型: 函数 ()
      如何突出显示无效的字段。 覆盖决定哪些字段以及如何突出。

      例子 :突出一个无效的元素由衰落,再来。

      1 2 3 4 5 6 7

      $(".selector").validate({ highlight: function(element, errorClass) { $(element).fadeOut(function() { $(element).fadeIn(); }); } });

      例子 :添加错误类均无效的元素和它的标签

      1 2 3 4 5 6 7 8 9 10 11 12

      $(".selector").validate({ highlight: function(element, errorClass, validClass) { $(element).addClass(errorClass).removeClass(validClass); $(element.form).find("label[for=" + element.id + "]") .addClass(errorClass); }, unhighlight: function(element, errorClass, validClass) { $(element).removeClass(errorClass).addClass(validClass); $(element.form).find("label[for=" + element.id + "]") .removeClass(errorClass); } });

      这个回调函数会被三个参数:

      • 元素
        类型: 元素
        无效的DOM元素,通常一个 输入 。
      • errorClass
        类型: 字符串
        的当前值 errorClass 选项。
      • validClass
        类型: 字符串
        的当前值 validClass 选项。
    • 显示 (默认值: 删除errorClass )
      类型: 函数 ()
      打电话回复所做更改的选择突出显示,同样的参数作为突出。
    • ignoreTitle (默认值: 假 )
      类型: 布尔
      设置为跳过阅读消息从标题属性,有助于避免问题与谷歌工具栏,默认是假的compability,消息从标题很可能被完全移除在将来的版本中。

      例子 :配置插件忽略标题属性验证元素当寻找信息。

      1 2 3

      $(".selector").validate({ ignoreTitle: true });

此方法设置事件处理程序提交、专注、keyup、模糊和点击触发验证整个表单或单个元素。 每个人可以被禁用,看到幻觉之上选项(onsubmit,onfocusout,onkeyup,onclick)。 focusInvalid集中元素当提交无效的形式。

使用debug选项来缓解设置验证规则,它总是阻止默认提交,即使脚本发生错误。

使用submitHandler来实现自己的表单提交,如。 通过Ajax。 使用invalidHandler做出反应,当一个无效的表单提交。

使用规则和信息来指定哪些元素来验证,以及如何。 看到 规则() 为更多的细节关于指定验证规则。

使用errorClass,errorElement,包装,errorLabelContainer,errorContainer,showErrors,成功,errorPlacement,突出,显示,ignoreTitle控制如何无效元素和错误消息显示。