当前位置：首页 > 软件库 > jQuery 插件 > jQuery表单及相关 >

validator-js

JavaScript 表单验证

授权协议 MIT

开发语言 JavaScript

所属分类 jQuery 插件、 jQuery表单及相关

软件类型开源软件

地区国产

投递者袁弘化

操作系统跨平台

开源组织无

适用人群未知

软件概览

轻量级的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()

使用案例

validator.js文件的部分验证方法

/*是否合法IP地址*/ export function validateIP(rule, value,callback) { if(value==''||value==undefined||value==null){ callback(); }else { const reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1
jQuery验证插件validate.js

validate.js介绍 Validate是基于jQuery的一款轻量级验证插件，内置丰富的验证规则，还有灵活的自定义规则接口，HTML、CSS与JS之间的低耦合能让您自由布局和丰富样式，支持input,select,textarea`的验证。 validate.js兼容性 jQuery兼容：兼容jQuery1.7以上的版本浏览器兼容：兼容IE7 以上，Chrome，Firefox，Opera
validate.js

前端的validate.js /** * Created by PanJiaChen on 16/11/18. */ /** * @param {string} path * @returns {Boolean} */ export function isExternal(path) { return /^(https?:|mailto:|tel:)/.test(path)
jQuery.validator

官方地址：http://bassistance.de/jquery-plugins/jquery-plugin-validation/ jQuery用户手册：http://jquery.org.cn/visual/cn/index.xml $(document).ready(function(){ /* 设置默认属性 */ $.validator.setDefaults({ submitH
validation.js使用

前些日子写过的，但是不知怎么的，在FireFox上可以看，在IE下看不到文章。所以只好删掉，重写一次。初学JavaEE，什么都不知道，在论坛浏览的时候，偶尔看到一个页面验证的js文件，感觉很好，甚是感谢写这些工具的高手，憧憬自己有一天也能写出供大家使用的工具函数。 Badqiu在原来外国那哥们写的基础上又加了一些功能，但是他给的是GBK 编码的文件，我觉得UTF-8比较方便，自己用记事本另
jQuery.validate.js API

Name Type validate( options ) Returns: Validator 验证所选的FORM valid( ) Returns: Boolean 检查是否验证通过 rules( ) Returns: Options 返回元素的验证规则 rules( "add", rules ) Returns: Options 增加验证规则。 rules( "remove", rules
validate.js使用方法

菜鸟教程 :http://www.runoob.com/jquery/jquery-plugin-validate.html 相关js css可以在这里下载需要注意的是这里的relues中的所有属性捕获的是表单中的name属性 // 在键盘按下并释放及提交后验证提交表单 $(".myfrom").validate({ rules:{ title : { required: true }, new
jquery.validate.js 详解

jquery下载地址：https://jquery.com/download/ jquery.validate.js下载地址：https://cdnjs.com/libraries/jquery-validate jquery.validate.js是我们经常用到的form表单验证插件，可以很方便的帮我们进行表单验证。这里来学习一下他的用法，觉得不够详细的同学，可以去官网继续学习。 1.jquer
validate.js插件使用

jQuery Validate验证框架详解
jquery.validate.js

/* * jQuery validation plug-in 1.5.2 * * http://bassistance.de/jquery-plugins/jquery-plugin-validation/ * http://docs.jquery.com/Plugins/Validation * * Copyright (c) 2006 - 2008 JA¶rn Zaef
async-validator.js数据校验器

文档： https://www.npmjs.com/package/async-validator https://github.com/yiminghe/async-validator 安装 npm i async-validator 示例 // demo.mjs // node(v16.14.0) // import Schema from 'async-validator'; // f
validator

012-7-13 9:25:59 com.opensymphony.xwork2.util.logging.commons.CommonsLogger error 严重: The content of element type "field-validator" is incomplete, it must match "(param*,message)". at (null:30:23)
javascript验证Validator.js

/************************************************* Validator v1.03 code by 我佛山人 wfsr@msn.com *************************************************/ Validator = { Require : /.+/, Email
js验证validate

 <script src="${ctx}/plugins/jquery-validation/1.11.1/jquery.validate.min.js" type="text/javascript"></script> <script src="${ctx}/plugins/jquery-validation/1.11.1/messages_bs
js validate 的用法

从官网下载 jquery-validation-1.13.0.zip，或其他版本。解压缩该压缩包，可以看到里面的目录结构我们可以看到在默认情况下，validation 的提示信息是英文的。但其也提供了本地化文件，在压缩包中有一个 localization 文件夹，找到该文件夹下的中文文件，放到项目中，并在页面引用。 Ajax 的用法，使用remote 方法。代码如下： <input id="u
validate.js插件用法

下载地址validate.js插件 **<@layout.head> <script type="text/javascript" src="${base}/res/js/jquery-ui/jquery.ui.js"></script> <script type="text/javascript" src="${base}/res/js/jquery-ui/i18n/zh-CN.js" char
Validators

验证器 (Validators) 验证器对于在不同类型的字段之间重用验证逻辑非常有用。—— Django 文档大多数情况下，您在 REST framework 中处理验证时，只需依赖默认的字段验证，或者在序列化器或字段类上编写显式的验证方法。但是，有时您需要将验证逻辑放入可重用的组件中，以便可以在整个代码库中轻松地重用它。这可以通过使用验证器函数和验证器类来实现。 REST framework
npm组件 validator.js 校验集合

官网：https://www.npmjs.com/package/validator 验证器列表验证器说明 contains(str, seed) 检查包含 equals(str, comparison) 检查相等 isAfter(str [, date]) 验证给出的时间字符串是否在指定日期之后 isAlpha(str [, locale]) 检查字符串是否只是由Alpha字符组成 isAl
validate.js实现自定义验证

jQuery的表单验证框架添加自定义验证方式： validate.js提供了addMethod方法可使用户实现自定义验证，如下所示：其中有三个参数，methodName即为验证的方法名，在验证rules里若设置为true，则会调用function方法对表单数据进行验证。function即为验证数据函数，第三个参数为默认的提示信息。 jQuery.validator.addMethod("

validator-js

安装使用

模块

客户端使用

说明文档

formName

option

callback

例子

字符串验证

模块

表单中验证

同类工具

相关阅读

相关文章

相关问答

相关文档