前端校验插件——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 ...
随机推荐
- hadoop生态之mapReduce-Yarn
一.inputSplit 1.什么是block 块是以 block size 进行划分数据. 因此,如果群集中的 block size 为 128 MB,则数据集的每个块将为 128 MB,除非最后一 ...
- vue路由实现多视图的单页应用
多视图的单页应用:在一个页面中实现多个页面不同切换,url也发生相应变化. router-view结合this.$router.push("/pickUp")实现,效果如下: 当点 ...
- Pushgateway 介绍
Pushgateway是一个独立的服务,Pushgateway位于应用程序发送指标和Prometheus服务器之间. Pushgateway接收指标,然后将其作为目标被Prometheus服务器拉取. ...
- Vue学习笔记五:事件修饰符
目录 什么是事件修饰符 没有事件修饰符的问题 HTML 运行 使用事件修饰符 .stop阻止冒泡 .prevent 阻止默认事件 .capture 添加事件侦听器时使用事件捕获模式 .self 只当事 ...
- Redis源码 - 事件管理
Redis 的事件分类 分类 描述 定时器 线程内定时响应,更新缓存时间.关闭非活动的客户端连接等等 pipe 线程间通信,用于其他线程通知主线程退出aeApiPoll() unixsocket 本地 ...
- css 修改placeholder的颜色
input::-webkit-input-placeholder { color: #ff0000; } input::-moz-input-placeholder { color: #ff0000; ...
- LeetCode刷题-004两个排序数组的中位数
给定两个大小为 m 和 n 的有序数组 nums1 和 nums2 . 请找出这两个有序数组的中位数.要求算法的时间复杂度为 O(log (m+n)) . 示例 1:nums1 = [1, 3]num ...
- Pytorch学习笔记(一)Numpy SciPy MatPlotlib Tutorial
英文原文链接:http://cs231n.github.io/python-numpy-tutorial/ Numpy Numpy是Python中科学计算的核心库.它提供了一个高性能的多维数组对象,以 ...
- SQL server 数据库中插入中文变???格式乱码的问题另一种容易忽略的情况(C#操作dapper)
1.先查查 VS2015 中的XXX.cs页面中编码格式,记事本打开另存一下,编码格式可能是ANSI改为unioncode. (中文前面加N或者改排序规则解决不了的情况有可能是以上原因.)
- mvc路由报错
1.添加新项目时,把就项目的dll一起拷贝过来.生成项目,编译通过,打开页面时报错:“找到多个与名为“Home”的控制器匹配的类型 ”,网上的解决方案是,加命名空间,解决,但是自己这边删掉bin中原来 ...