前端校验插件——Validator简单使用
>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>欢迎转载,转载请注明出处-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简单使用的更多相关文章
- nice-validator表单验证插件的简单使用
前言 前端表单校验是过滤无效数据.假数据.有毒数据的第一步,是数据安全的第一道关卡,虽然我们不能100%相信客户端提交的数据(真正的校验还得在服务端进行),但设置前端表单校验也是至关重要的,自己写逻辑 ...
- 【JAVAWEB学习笔记】28_jqueryAjax:json数据结构、jquery的ajax操作和表单校验插件
Ajax-jqueryAjax 今天内容: 1.json数据结构(重点) 2.jquery的ajax操作(重点) 3.jquery的插件使用 一.json数据结构 1.什么是json JSON(J ...
- 程序猿必备的8款web前端开发插件三
1.HTML5 Canvas 3D波浪翻滚动画 之前我们分享过好几款基于HTML5 Canvas的波浪和水波纹动画,比如这款HTML5 3D波浪起伏动画特效和这款超酷无比的HTML5 WebGL水面水 ...
- validate表单校验插件笔记
1validation知识点 1 validation基础 validation插件下载http://bassistance.de/jquery-plugins/jquery-plugin-valid ...
- 第一百八十三节,jQuery-UI,知问前端--验证插件
jQuery-UI,知问前端--验证插件 学习要点: 1.使用 validate.js 插件 2.默认验证规则 3.validate()方法和选项 4.validate.js 其他功能 验证插件(va ...
- 表单校验插件(bootstrap-validator)
表单校验插件(bootstrap-validator) 参考文档 http://blog.csdn.net/nazhidao/article/details/51542508 http://blog. ...
- Jquery前端分页插件pagination同步加载和异步加载
上一篇文章介绍了Jquery前端分页插件pagination的基本使用方法和使用案例,大致原理就是一次性加载所有的数据再分页.https://www.jianshu.com/p/a1b8b1db025 ...
- Jquery前端分页插件pagination使用
插件描述:JqueryPagination是一个轻量级的jquery分页插件.只需几个简单的配置就可以生成分页控件.并且支持ajax获取数据,自定义请求参数,提供多种方法,事件和回调函数,功能全面的分 ...
- Sublime Text3的react代码校验插件
之前写前端一直用的是jshint做语法检查,但jshint不支持JSX语法,为了在React使用,需要用eslint代替它.六月份的时候为了写React Native,编辑器换过Webstorm和VS ...
随机推荐
- Outlook 2013 日历/任务本地备份与还原
1.日历: 备份日历:切换到日历项,按如下步骤备份.文件 --> 保存日历 --> 其它选项: 日期范围:指定日期(开始日期:2018/1/1,结束日期:2018/12/31) 详细信息: ...
- (转)spring异常抛出触发事务回滚策略
背景:在面试时候问到事务方法在调用过程中出现异常,是否会传递的问题,平时接触的比较少,有些懵逼. spring异常抛出触发事务回滚策略 Spring.EJB的声明式事务默认情况下都是在抛出unchec ...
- 08--STL关联容器(set/multiset)
一:set/multiset的简介 set是一个集合容器,其中所包含的元素是唯一的,集合中的元素按一定的顺序排列.元素插入过程是按排序规则插入,所以不能指定插入位置. set采用红黑树变体的数据结构实 ...
- [笔记]JS flat and flatMap
原文 flat()接收一个数组(这个数组中的某些item本身也是一个数组),返回一个新的一维数组(如果没有特别指定depth参数的话返回一维数组). const nestedArraysOhMy = ...
- HTTP深入浅出 http请求完整过程
HTTP(HyperText Transfer Protocol)是一套计算机通过网络进行通信的规则.计算机专家设计出HTTP,使HTTP客户(如Web浏览器)能够从HTTP服务器(Web服务器)请求 ...
- -source 1.5 中不支持泛型(请使用-source5或更高版本)
Idea中maven--compile时报错 -source 1.5 中不支持泛型(请使用-source5或更高版本) 解决办法 在项目的pom.xml中,添加 <build> & ...
- setLocale(java.util.Locale), setCharacterEncoding(java.lang.String),setContentType(java.lang.String type)
对于setCharacterEncoding(java.lang.String),这个方法是javax.servlet.ServletRequest和javax.servlet.ServletResp ...
- windows上安装zip版mongodb
版本3.4:现将mongodb解压,再选择一个位置创建data文件夹并在其下创建db文件夹和log文件夹 然后编写mongod.cfg文件,注意这里用的yaml格式,对空格很敏感,并且要注意mongo ...
- word20170108逛景点 Sightseeing有用的词和句子
有用的词: sights and attractions: 景点 ticket booth: 售票处 will call ticket: 网络售票 guided tour: 带导游的游览 audio ...
- C++变量/函数命名规范
## 参照Google C++编程规范之变量命名 1. 变量 变量名一律小写,单词间以下划线相连.类的成员变量以下划线结尾. 普通变量命名 举例: string window_name; // OK ...