`
desert3
  • 浏览: 2160683 次
  • 性别: Icon_minigender_1
  • 来自: 合肥
社区版块
存档分类
最新评论

jquery-validation-1.9.0

 
阅读更多
jQuery验证插件:
简单高效的客户端验证框架,提供很多属性来实现个性化效果。,显示尽可能少的错误提示信息来提示用户使得画面达到用户友好的效果。
内置很多常用的验证方法,如Email,Url等,同时也提供接口来实现自己的验证方法,也可以调用服务器端方法来验证
支持国际化,支持36种语言的错误提示,默认使用英语版的错误提示消息。
form提交的时候默认焦点设置在第一个验证不通过的控件上(也可以倒着来),如果有2个控件验证都通不过,并且提交前焦点在后一个控件上,那么会自动把焦点设置在后一个控件上方便用户修改。
值修改后自动验证以及多错误同时显示:在提交时,默认会把所有验证通不过的控件都标记出来,同时在修正的时候,如果修正后的值会通过验证,那么错误标记会自动消失。
懒验证:在Form第一次提交之前,使用tab键切换控件的时候不会触发验证操作。但是修改值的时候会自动调用验证方法进行验证。如果验证通过,相应的错误提示信息会自动消失。
$.validator.addMethod( name, method, [message] ) 可以实现条件验证的效果,即根据条件动态增加、删除验证规则 使用例子见下面

插件中很重要的2个概念:
method:验证方法,实现真正的验证逻辑
rule:验证规则,控件关联的验证方法名,表示控件需要进行的验证操作
默认使用class="required email"的方式来设置控件对应的验证规则
// 也可以在调用验证方法的时候,设置验证规则和关联控件,这时候冒号前面默认是控件名,对应控件的name属性!!! 对应jquery选择器?
$("#myform").validate({
  rules: {
    txtUrl: {url: true},
    txtEmail: {email : true},
    // no quoting necessary
    name: "required",
    // quoting necessary! 名字中有特殊字符的时候,需要把选择器用双引号包起来
    "user[email]": "email",
    // dots need quoting, too!
    "user.address.street": "required"
  }
});

默认内置的方法:
required( )	Returns: Boolean
Makes the element always required.
required( dependency-expression )	Returns: Boolean
Makes the element required, depending on the result of the given expression.
required( dependency-callback )	Returns: Boolean
Makes the element required, depending on the result of the given callback.
remote( options )	Returns: Boolean
Requests a resource to check the element for validity.
minlength( length )	Returns: Boolean
Makes the element require a given minimum length.
maxlength( length )	Returns: Boolean
Makes the element require a given maxmimum length.
rangelength( range )	Returns: Boolean
Makes the element require a given value range.
min( value )	Returns: Boolean
Makes the element require a given minimum.
max( value )	Returns: Boolean
Makes the element require a given maximum.
range( range )	Returns: Boolean
Makes the element require a given value range.
email( )	Returns: Boolean
Makes the element require a valid email
url( )	Returns: Boolean
Makes the element require a valid url
date( )	Returns: Boolean
Makes the element require a date.
dateISO( )	Returns: Boolean
Makes the element require a ISO date.
number( )	Returns: Boolean
Makes the element require a decimal number.
digits( )	Returns: Boolean
Makes the element require digits only.
creditcard( )	Returns: Boolean
Makes the element require a creditcard number.
accept( extension )	Returns: Boolean
Makes the element require a certain file extension.
equalTo( other )	Returns: Boolean
Requires the element to be the same as another one

更加多的方法是以插件的形式包含在additional-methods.js中提供的

分组验证,多个控件一起验证(对应一个验证方法,一个提示消息):Plugins/Validation/multiplefields
重构验证(多个控件用相同的验证规则和提示消息):
// alias required to cRequired with new message
$.validator.addMethod("cRequired", $.validator.methods.required,
  "Customer name required");
// alias minlength, too
$.validator.addMethod("cMinlength", $.validator.methods.minlength, 
  // leverage parameter replacement for minlength, {0} gets replaced with 2
  $.format("Customer name must have at least {0} characters"));
// combine them both, including the parameter for minlength
$.validator.addClassRules("customer", { cRequired: true, cMinlength: 2 });

// 多个客户名输入框,有相同的class:customer
<input name="customer1" class="customer" />
<input name="customer2" class="customer" />
<input name="customer3" class="customer" />

错误提示消息的优先顺序:A custom message (passed by plugin options), the element's title, the default message.
插件调试:把debug 选项值设置为true,不管验证是否通过,它都会阻止form的提交,并且输出一些有用的信息到window.console(可以通过firebug或者firebug lite看到)
当有多个form在画面时,插件默认每次只验证一个form,可以通过 $.validator.setDefaults({...}) 来修改默认行为,使得一次验证多个form
Ajax验证:
$("#myform").validate({
  rules: {
    username: {
      required: true,
      minLength: 2,
      remote: "users.php"
    }
  },
  messages: {
    username: {
      required: "Enter your username",
      minLength: "At least 2 characters are necessary",
      remote: String.format("The name {0} is already in use")
    }
  }
});

修改默认的提示信息:
$.extend($.validator.messages, {
  required: "Eingabe nötig",
  email: "Bitte eine gültige E-Mail-Adresse eingeben",
  ...
});


协议:MIT/GPL
官网:jQuery plugin: Validation
参考文档:Plugins/Validation
演示Demo:jQuery Validation Plugin Demo
FAQ:Plugins/Validation/Reference
分享到:
评论

相关推荐

    jquery-validation

    jquery-validation-1.9.0是一款优秀的form表单验证插件,此资源主要为某篇博客服务,如有需要还请下载。整个压缩包无法上传,有需要请留言

    jquery-validation-1.9.0.zip

    《jQuery Validation插件1.9.0版深度解析》 jQuery Validation插件是Web开发中一个非常实用的工具,主要用于表单验证,确保用户输入的数据符合预设的规则,从而提高用户体验并降低服务器端的压力。在1.9.0版本中,...

    jquey-validation

    在提供的"jquery-validation-1.9.0"压缩包中,通常会包含以下内容: - `jquery.validate.js`:主验证脚本文件。 - `additional-methods.js`:可能包含额外的验证方法。 - `localization` 文件夹:包含各种语言的...

    Jquery验证框架【可以通过正则表达式验证】

    我在 jquery-validation-1.9.0版本的基础上增加了可以验证正则表达式的功能,由于我在使用当中发现其的邮箱验证不能很好的验证,输入中文后只要在后面加个@符号,他就通过,比如 【时代的@ff.cc】 这样也能通过 ...

    jquery.validate 版本大全

    jquery.validate.1.9.0.min.js jquery.validate.1.12.0.min.js jquery.validate.1.13.1.min.js jquery.validate.1.16.0.min.js jquery.validate.1.14.0.min.js jquery.validate.1.15.1.min.js jquery.validate....

    jquery插件

    &lt;script src="jquery-validation-1.9.0/jquery.validate.min.js"&gt; ``` 2. **初始化验证**:在表单元素上应用 `validate` 方法,并可配置验证规则和选项: ```javascript $(document).ready(function() { $('#myForm...

    jQuery1.9.rar

    - **插件使用**:jQuery拥有丰富的第三方插件生态系统,如jQuery UI、jQuery Validation等,它们扩展了jQuery的功能,但需谨慎选择和管理,避免引入过多的依赖。 - **性能优化**:合理使用jQuery的高效方法,如...

    jquery的validate表单校验插件

    例如,我们可以引入名为`jquery-validation-1.9.0`的压缩包,其中包含了validate插件的主要文件。该版本的插件包含`jquery.validate.js`主文件,以及可能需要的`additional-methods.js`,后者提供了更多预定义的验证...

    jQuery.Validate验证库的使用介绍

    jQuery.Validate验证库1、下载jquery.validate,这里我提供jquery-validation-1.9.0,点击下载 默认校验规则 代码如下:(1)required:true 必输字段(2)remote:”check.php” 使用ajax方法调用check.php验证输入值(3)...

    jquery.validate.js

    * jQuery Validation Plugin 1.9.0 * * http://bassistance.de/jquery-plugins/jquery-plugin-validation/ * http://docs.jquery.com/Plugins/Validation * * Copyright (c) 2006 - 2011 Jörn Zaefferer * ...

    jQuery Validation实例代码 让验证变得如此容易

    使用客户端验证可以有效的减少数据往返服务器和客户端的次数,有利于提高服务器的资源利用路,并且还能够给用户直观,快速的回应。 在Web 2.0时代,这显得... 让我们以一个简单的实例来开始我们对于jQuery Validation

    MVC快速开发框架

    客户端验证:jQuery Validation Plugin 1.9.0。 在线编辑器:ckeditor、simditor 上传文件:Uploadify v3.2.1 动态页签:Jerichotab(自己改造) 数据表格:jqGrid、Bootstrap Talbe 对话框:layer-v2.3 下拉...

    bootstrap后台管理模板

    客户端验证:jQuery Validation Plugin 1.9.0。 在线编辑器:ckeditor、simditor 上传文件:Uploadify v3.2.1 动态页签:Jerichotab(自己改造) 数据表格:jqGrid、Bootstrap Talbe 对话框:layer-v2.3 下拉...

    NFine快速开发框架.rar

    客户端验证:jQuery Validation Plugin 1.9.0。 在线编辑器:ckeditor、simditor 上传文件:Uploadify v3.2.1 动态页签:Jerichotab(自己改造) 数据表格:jqGrid、Bootstrap Talbe 对话框:layer-v2.3 下拉...

    快速开发框架NFine ASP.NET MVC+EF6+Bootstrap开发框架

    •客户端验证:jQuery Validation Plugin 1.9.0。 •在线编辑器:ckeditor、simditor •上传文件:Uploadify v3.2.1 •动态页签:Jerichotab(自己改造) •数据表格:jqGrid、Bootstrap Talbe •对话框:...

    NFine快速开发框架源码 NFineRapidFramework.rar

    客户端验证:jQuery Validation Plugin 1.9.0。 在线编辑器:ckeditor、simditor 上传文件:Uploadify v3.2.1 动态页签:Jerichotab(自己改造) 数据表格:jqGrid、Bootstrap Talbe 对话框:layer-v2.3 下拉...

    C# mvc框架创建文档 基于bootstrap前端框架

    - **JQuery 插件**:文件中还提到了多个jQuery插件,如jQuery.FileUpload、jQuery.Validation等,这些插件扩展了jQuery的核心功能,用于实现文件上传、表单验证等功能。 - **font-awesome**:版本4.6.1,这是一个...

    jQwidgets 3.6.0

    Important: jQuery team has decided that starting from jQuery version 1.9.0 the project will evolve in two parallel tracks. Versions 1.9.* will support older browsers while versions starting from 2.* ...

Global site tag (gtag.js) - Google Analytics