前端校验插件——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 ...
随机推荐
- bzoj1997 Planar
题目链接 思路 首先以那个环为框架,把所有的边连出来.如果有两条边相交,那么就把其中一条放到环外面去. 如图: \((1,3)\)与\((2,5)相交,\)(1,4)\(与\)(2,5)相交.所以我们 ...
- Linux核心命令使用方法
一.Linux命令行常用快捷键 ctrl + c cancel 取消当前的操作 ctrl + l (小写字母L) clear(命令)清空当前屏幕 ctrl + d 退出当前用户 ctrl + r 查找 ...
- MySQL8.0.19主从环境搭建(CentOS7)
默认情况下,复制是异步的,从站不需要永久连接以接收来自主站的更新.根据配置,您可以复制数据库中的所有数据库,所选数据库甚至选定的表. MySQL中复制的优点包括: 横向扩展解决方案 - 在多个从站之间 ...
- 使用百度云 BOS 和 C# SDK 开发数据存储
Ø 简介 本文主要介绍如何使用百度云的 C# SDK 操作 BOS(Baidu Object Storage/百度对象存储),以及常见问题和解决办法.本文将以以下几点展开学习: 1. 基本介绍 ...
- 题解 P1801 【黑匣子_NOI导刊2010提高(06)】
蒟蒻来发题解了.我仔细看了一下其他题解,各位巨佬用了堆,红黑树,splay,treap之类的强大算法,表示蒟蒻的我只会口胡这些算法,所以我决定用一种极其易理解的算法————fhq treap,作为tr ...
- Linux基础系统优化及常用命令
# Linux基础系统优化及常用命令 [TOC] ## Linux基础系统优化 Linux的网络功能相当强悍,一时之间我们无法了解所有的网络命令,在配置服务器基础环境时,先了解下网络参数设定命令. - ...
- 第31月第15天 -fembed-bitcode
1. 确保打包的时候使用的是fembed-bitcode, 而不是fembed-bitcode-maker fembed-bitcode-maker:只是简单的标记一下在archive出来的二进制中b ...
- Git分支实战入门详细图解
现在我们模拟一个简单的分支和合并案例,其中工作流可供真实项目借鉴. (1)在master开展工作 (2)为新的需求创建分支 (3)在新的分支上展开工作 这时,你接到一个电话,说项目有一个严重的问题需要 ...
- BufferedReader类里面mark(int readAheadLimit)中readAheadLimit到底代表什么
昨天用到了BufferedReader类里面mark(int readAheadLimit)方法,对于文档里面readAheadLimit的解释有些没弄懂,就翻开源码研究.具体的源码分析可以参见htt ...
- JavaScript—对象创建方式
JavaScript 也是面向对象的语言(oop) 之前学JavaScript 没有学对象.现在做下笔记 创建对象的方式: 1. 对象字面量 const hero = { name: '吕布', w ...