>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>欢迎转载,转载请注明出处-VirgoArt,www.cnblogs.com

1.引用jquery-1.9.1.min.js与jquery.validate.min.js

2.在JS加载初始化时,进行事件绑定。

3.BindEvent(); 初始化插件,应用。

4.BindEvent(); 实现自定义校验方法:

$.validator.addMethod("methodName", function(value, element) {
if(){
return true;
}else{
return false;
}
}, "");

5.绑定表单校验

_validate = $("#formId").validate({
rules : {
'inputName' : {
required : true,
methodName :true
}
},
messages : {
'inputName' : {
required : "该项为必填项",
methodName:"输入不满足规则"
}
}
});

6.为当前表单输入框追加校验

var rules = {};
rules[inputName1] = {
methodName: true
};
rules[inputName2] = {
methodName: true
};
$.extend(_validate.settings.rules, rules);
var messages = {};
messages[inputName1] = {
methodName:" 输入不满足规则"
};
messages[inputName2] = {
methodName: "输入不满足规则"
};
$.extend(_validate.settings.messages, messages);

7.提交时,验证是否可以提交

if (!$("#formId ").valid()) {
return;
}

前端校验插件——Validator简单使用的更多相关文章

  1. nice-validator表单验证插件的简单使用

    前言 前端表单校验是过滤无效数据.假数据.有毒数据的第一步,是数据安全的第一道关卡,虽然我们不能100%相信客户端提交的数据(真正的校验还得在服务端进行),但设置前端表单校验也是至关重要的,自己写逻辑 ...

  2. 【JAVAWEB学习笔记】28_jqueryAjax:json数据结构、jquery的ajax操作和表单校验插件

    Ajax-jqueryAjax 今天内容: 1.json数据结构(重点) 2.jquery的ajax操作(重点) 3.jquery的插件使用   一.json数据结构 1.什么是json JSON(J ...

  3. 程序猿必备的8款web前端开发插件三

    1.HTML5 Canvas 3D波浪翻滚动画 之前我们分享过好几款基于HTML5 Canvas的波浪和水波纹动画,比如这款HTML5 3D波浪起伏动画特效和这款超酷无比的HTML5 WebGL水面水 ...

  4. validate表单校验插件笔记

    1validation知识点 1 validation基础 validation插件下载http://bassistance.de/jquery-plugins/jquery-plugin-valid ...

  5. 第一百八十三节,jQuery-UI,知问前端--验证插件

    jQuery-UI,知问前端--验证插件 学习要点: 1.使用 validate.js 插件 2.默认验证规则 3.validate()方法和选项 4.validate.js 其他功能 验证插件(va ...

  6. 表单校验插件(bootstrap-validator)

    表单校验插件(bootstrap-validator) 参考文档 http://blog.csdn.net/nazhidao/article/details/51542508 http://blog. ...

  7. Jquery前端分页插件pagination同步加载和异步加载

    上一篇文章介绍了Jquery前端分页插件pagination的基本使用方法和使用案例,大致原理就是一次性加载所有的数据再分页.https://www.jianshu.com/p/a1b8b1db025 ...

  8. Jquery前端分页插件pagination使用

    插件描述:JqueryPagination是一个轻量级的jquery分页插件.只需几个简单的配置就可以生成分页控件.并且支持ajax获取数据,自定义请求参数,提供多种方法,事件和回调函数,功能全面的分 ...

  9. Sublime Text3的react代码校验插件

    之前写前端一直用的是jshint做语法检查,但jshint不支持JSX语法,为了在React使用,需要用eslint代替它.六月份的时候为了写React Native,编辑器换过Webstorm和VS ...

随机推荐

  1. lumen 支持多文件上传

    1.webform (注意:name后面一定要加[]号) <form method="post" enctype="multipart/form-data" ...

  2. 20175209 实验二《Java面向对象程序设计》实验报告

    20175209 实验二<Java面向对象程序设计>实验报告 一.实验前期准备 了解三种代码 伪代码 产品代码 测试代码 我们先写伪代码,伪代码 从意图层面来解决问题: 有了伪代码 我们用 ...

  3. Modbus通讯两种传输方式

    控制器能设置为两种传输模式(ASCII或RTU)中的任何一种在标准的Modbus网络通信.用户选择想要的模式,包括串口通信参数(波特率.校验方式等),在配置每个控制器的时候,在一个Modbus网络上的 ...

  4. 解决系统中大量的TIME_WAIT连接

    今天发现网站特别卡!! 查看网络连接数: netstat -an |wc -l netstat -an |grep xx |wc -l        查看某个/特定ip的连接数 netstat -an ...

  5. Mybatis的缓存

    1.缓存是什么 在 Mybatis 里面,所谓的缓存就是将已经查询过的记录放在内存的缓冲区或文件上,这样如果再次查询,可以通过配置的策略,命中已经查询过的记录,从而提高查询的效率. Mybatis 的 ...

  6. 异常处理--logging模块

    一. 异常处理 1. 异常类型: 语法错误 : 空格 缩进 语法规则 应该在我们写代码的时候就避免 逻辑错误: 应该在程序当中写代码处理 条件判断 异常处理 2. 常见的报错类型: Attribute ...

  7. 浅入深出Vue:环境搭建

    浅入深出Vue:环境搭建 工欲善其事必先利其器,该搭建我们的环境了. 安装NPM 所有工具的下载地址都可以在导航篇中找到,这里我们下载的是最新版本的NodeJS Windows安装程序 下载下来后,直 ...

  8. 【尚学堂·Hadoop学习】MapReduce案例2--好友推荐

    案例描述 根据好友列表,推荐好友的好友 数据集 tom hello hadoop cat world hadoop hello hive cat tom hive mr hive hello hive ...

  9. sql的四种匹配模式

    1. % 表示任意0个或多个字符.如下语句:Select * FROM user Where name LIKE '%三%'; 将会把name为“张三”,“三脚猫”,“唐三藏”等等有“三”的全找出来. ...

  10. 记事本:一些js案例以及DOM和BOM

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...