validator-jsJavaScript 表单验证
轻量级的JavaScript表单验证,字符串验证。没有依赖,支持UMD,~3kb。
http://jaywcjlove.github.io/validator.js
安装使用
模块
在应用中引用 validator.min.js 文件
# npm 安装 $ npm install validator.tool --save # bower 安装 $ bower info validator.tool
在 .js 文件中调用
// 字符串验证 var validator = require('validator.tool'); var v = new validator(); v.isEmail('wowohoo@qq.com'); v.isIp('192.168.23.3'); v.isFax(''); // 表单验证 var a = new validator('example_form',[ {...} ],function(obj,evt){ if(obj.errors){ // 判断是否错误 } })
客户端使用
在应用中引用 validator.min.js 文件
<script type="text/javascript" src="dist/validator.min.js"></script>
在JS中使用方法。
<script type="text/javascript"> var v = new Validator(); v.isEmail('wowohoo@qq.com'); v.isIp('192.168.23.3'); </script>
应用在表单中的方法。
<form id="example_form"> <div> <label for="email">邮箱验证</label> <input type="email" name="email" id="email" class="form-control" placeholder="Email"> </div> </form> <script type="text/javascript"> var validator = new Validator('example_form',[ { //name 字段 name: 'email', display:"你输入的不{{email}}是合法邮箱|不能为空|太长|太短", // 验证条件 rules: 'is_emil|max_length(12)' // rules: 'valid_email|required|max_length(12)|min_length(2)' },{ //name 字段 name: 'sex', display:"请你选择性别{{sex}}", // 验证条件 rules: 'required' } ],function(obj,evt){ if(obj.errors){ // 判断是否错误 } }) </script>
说明文档
new Validator(formName, option, callback)
formName
formName 是标签中<form> 中的 id 或者 name 的值,如上面的example_form
option
-
name -> input 中 name 对应的值
-
display -> 验证错误要提示的文字 {{这个中间是name对应的值}}
-
rules -> 一个或多个规则(中间用|间隔)
-
is_email -> 验证合法邮箱
-
is_ip -> 验证合法 ip 地址
-
is_fax -> 验证传真
-
is_tel -> 验证座机
-
is_phone -> 验证手机
-
is_url -> 验证URL
-
required -> 是否为必填
-
max_length -> 最大字符长度
-
min_length -> 最小字符长度
-
{ //name 字段 name: 'email', display:"你输入的不{{email}}是合法邮箱|不能为空|太长|太短", // 验证条件 rules: 'is_email|max_length(12)' // rules: 'valid_email|required|max_length(12)|min_length(2)' }
callback
var validator = new Validator('example_form',[ {...},{...} ],function(obj,evt){ //obj = { // callback:(error, evt, handles) // errors:Array[2] // fields:Object // form:form#example_form // handles:Object // isCallback:true // isEmail:(field) // isFax:(field) // isIp:(field) // isPhone:(field) // isTel:(field) // isUrl:(field) // maxLength:(field, length) // minLength:(field, length) // required:(field) //} if(obj.errors.length>0){ // 判断是否错误 } })
例子
字符串验证
模块
在应用中引用 validator.min.js 文件
var v = new Validator(); v.isEmail('wowohoo@qq.com'); // -> 验证合法邮箱 |=> 返回布尔值 v.isIp('192.168.23.3'); // -> 验证合法 ip 地址 |=> 返回布尔值 v.isFax(''); // -> 验证传真 |=> 返回布尔值 v.isPhone('13622667263'); // -> 验证手机 |=> 返回布尔值 v.isTel('021-324234-234'); // -> 验证座机 |=> 返回布尔值 v.isUrl('http://JSLite.io'); // -> 验证URL |=> 返回布尔值 v.maxLength('JSLite',12); // -> 最大长度 |=> 返回布尔值 v.minLength('JSLite',3); // -> 最小长度 |=> 返回布尔值 v.required('23'); // -> 是否为必填(是否为空) |=> 返回布尔值
表单中验证
点击按submit按钮验证
var validator = new Validator('example_form',[ { //name 字段 name: 'email', display:"你输入的不{{email}}是合法邮箱|不能为空|太长|太短", // 验证条件 rules: 'is_email|max_length(12)' // rules: 'valid_email|required|max_length(12)|min_length(2)' },{ //name 字段 name: 'sex', display:"请你选择性别{{sex}}", // 验证条件 rules: 'required' } ],function(obj,evt){ if(obj.errors){ // 判断是否错误 } })
没有submit验证
var validator = new Validator('example_form',[ { //name 字段 name: 'email', display:"你输入的不{{email}}是合法邮箱|不能为空|太长|太短", // 验证条件 rules: 'is_email|max_length(12)' // rules: 'valid_email|required|max_length(12)|min_length(2)' },{ //name 字段 name: 'sex', display:"请你选择性别{{sex}}", // 验证条件 rules: 'required' } ],function(obj,evt){ if(obj.errors){ // 判断是否错误 } }) validator.validate()
评论
Jquery表单验证插件表单验证插件
目前支持对以下格式的值进行验证: cnum*-*(纯数字), char*-*(纯字母), zwen*-*(中文), bysc*-*(字母开头), mail(邮箱), yzbm(邮政编码) *
Jquery表单验证插件表单验证插件
0
AValidationsAndroid 表单验证
AValidations是一个免费的、开源的、简易的、遵循ApacheLicence2.0开源协议发布,超级容易扩展的android表单验证的小框架使用方法:1.下载zip或者克隆AValidatio
AValidationsAndroid 表单验证
0
Validform表单验证
Validform:一行代码搞定整站的表单验证!$(".demoform").Validform();为什么能如此方便?插件的核心思想就是把所有的验证条件及验证提示信息绑定到每个表单元素,让验证代码在
Validform表单验证
0
ValidationjQuery表单验证插件
jquery.validate.js是一款执行表单输入信息验证的jQuery插件。要求jQuery1.2.6+,compatiblewith1.3.x特点:安装简单内置超过20种数据验证方法直列错误提
ValidationjQuery表单验证插件
0
EasyValidatorJQuery表单验证插件
最容易上手的表单验证框架,故名EasyValidator。网上有很多流行JQ验证插件,但是用起来总是很麻烦,还要写一大堆的JS配置信息,上手难度大。本插件易上手,易维护,扩展性高,无需用户写任何JS代
EasyValidatorJQuery表单验证插件
0
微擎表单验证
微擎表单验证是一个让你的表单验证更为方便,快捷,安全的扩展,满足你的一切验证需求。中文|English目录验证器验证场景场景事件规则管理器内置规则自定义验证规则自定义消息默认值过滤器验证集合安装使用c
微擎表单验证
0