>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>欢迎转载,转载请注明出处-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. 【洛谷P1659】啦啦队排练

    题目大意:给定一个长度为 N 的字符串,求前 K 个长度为奇数的回文子串的长度的乘积是多少. 题解:利用回文自动机,将所有长度的回文串和个数求出来,按照长度排序进行模拟即可. 代码如下 // luog ...

  2. luogu5283 异或粽子

    题目链接 思路 首先求个前缀异或和,这样就可以\(O(1)\)的得到区间异或和了. 然后发现问题转化为 找出不同的\(k\)个二元组\(x,y\).使得\(a_x \otimes a_y\)的和最大. ...

  3. LA4080/UVa1416 Warfare And Logistics 最短路树

    题目大意: 求图中两两点对最短距离之和 允许你删除一条边,让你最大化删除这个边之后的图中两两点对最短距离之和. 暴力:每次枚举删除哪条边,以每个点为源点做一次最短路,复杂度\(O(NM^2logN)\ ...

  4. Java基础--二维数组

    1.二维数组的定义 二维数组表示行列二维结构,在栈空间中的二维数组的地址指向堆空间中的一维数组,堆空间中的一维数组的地址又指向一维数组所在的内存空间. 2.二维数组的声明 二维数组声明有3种方式,推荐 ...

  5. 轻量Pythonweb - flask+jinja2

    后台代码 MVC from flask import Flask,request,render_template app = Flask(__name__) @app.route('/',method ...

  6. vue+element-ui实现显示隐藏密码

    <template> <el-form :model="cuser_info" label-width="115px" label-posit ...

  7. Android Studio安装后配置默认新工程目录以及.gradle,.android,.m2和system,config目录

    关于在哪里设置:以下所有设置都是在没有打开工程的前提下设置的, Configure > Settings 如图: 不要使用 Configure > Project Defaults> ...

  8. 2.安装以太坊客户端(mac os)

    今天讲解在 mac系统下如何安装以太坊平台( Ethereum client) 1.以太坊客户端的介绍 从项目早期,为了适应不同系列的开发语言和操作系统,以太坊的团队就实现过很多客户端.如下面我们看到 ...

  9. LOJ #6509. 「雅礼集训 2018 Day7」C

    神仙题 LOJ #6509 题意 给定一棵树,点权为0/1,每次随机一个点(可能和之前所在点相同)走到该点并将其点权异或上1 求期望的移动距离使得所有点点权相同 题解 根本不会解方程 容易发现如果一个 ...

  10. 看不到git远程分支

    1.先用fetch命令更新remote索引 $ git fetch 2.再查看remote分支,发现已经可以看到目标分支 $ git branch -a 3.再切换分支 $ git checkout ...