前端jquery validate表单验证框架的使用
一.框架本身校验方法的扩展
建议写在页内用于扩展框架本身的一些校验方法,
使用频繁也可以直接在源码上修改
例如扩展手机号码的校验:
/*手机号码验证扩展 最新的号码
mobile: class的表示 放在html class中即可校验
value:u输入的值
element:从this.optional(element)来看 应该是框架本身的校验规则
*/
$.validator.addMethod("mobile", function(value, element) {
var length = value.length;
var tel=/^(((13[0-9]{1})|(14[5|7]{1})|(15([0-3]|[5-9]{1}))|(18[0,5-9]{1}))+\d{8})$/g;
return this.optional(element) || (length == 11 && tel.test(value));
}, "请正确填写您的手机号码");
将mobile 放在input class标识中就可以使用此套扩展的规则校验!
二,远程异步校验(借用菜鸟教程)
remote:URL
使用 ajax 方式进行验证,默认会提交当前验证的值到远程地址,如果需要提交其他的值,可以使用 data 选项。
remote: {
url: "check/email", //后台处理程序
type: "post", //数据发送方式
dataType: "json", //接受数据格式
data: { //要传递的数据
username: function() {
return $("#username").val();
}
}
}
参数多的时候 直接在data中加
data:{
username: function() {return $("#username").val();},
userphone: function() {return '${user.userphone}';}//使用el表达式
}
前端jquery validate表单验证框架的使用的更多相关文章
- ASP.NET MVC Jquery Validate 表单验证的多种方式
在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...
- [转]ASP.NET MVC Jquery Validate 表单验证的多种方式介绍
在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...
- Jquery Validate 表单验证的多种方式
ASP.NET MVC Jquery Validate 表单验证的多种方式 在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体 ...
- jQuery Validate 表单验证 — 用户注册简单应用
相信很多coder在表单验证这块都是自己写验证规则的,今天我们用jQuery Validate这款前端验证利器来写一个简单的应用. 可以先把我写的这个小demo运行试下,先睹为快.猛戳链接--> ...
- jQuery Validate 表单验证
在做网页表单时时常需要在客户端对表单填写的数据进行验证一番才能提交,我们可以通过自己编写JavasScript代码来验证,但是有时数据量过多时就会有些难度了.基于jQuery的jquery.valid ...
- (转)jQuery Validate 表单验证
在做网页表单时时常需要在客户端对表单填写的数据进行验证一番才能提交,我们可以通过自己编写JavasScript代码来验证,但是有时数据量过多时就会有些难度了.基于jQuery的jquery.valid ...
- jquery validate表单验证插件-推荐
1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家. 1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素 3.鼠标离开后的正确.错误提示及鼠标移入时的帮 ...
- jquery validate表单验证插件
1 表单验证的准备工作 在开启长篇大论之前,首先将表单验证的效果展示给大家. 1.点击表单项,显示帮助提示 2.鼠标离开表单项时,开始校验元素 3.鼠标离开后的正确.错误提示及鼠标移入时的帮 ...
- jQuery Validate 表单验证插件----自定义一个验证方法
一.下载依赖包 网盘下载:https://yunpan.cn/cryvgGGAQ3DSW 访问密码 f224 二.引入依赖包 <script src="../../scripts/j ...
随机推荐
- Angular.js之指令学习笔记
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"& ...
- iOS回顾笔记( 02 ) -- 由九宫格布局引发的一系列“惨案”
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,bi ...
- Spring框架中 配置c3p0连接池 完成对数据库的访问
开发准备: 1.导入jar包: ioc基本jar jdbcTemplate基本jar c3p0基本jar 别忘了mysql数据库驱动jar 原始程序代码:不使用配置文件方式(IOC)生成访问数据库对象 ...
- Hibernate框架双向多对多关联映射关系
建立双向多对多关联关系 Project.java (项目表) private Integer proid; private Strin ...
- C#基础——数组(冒泡排序)
数组 所谓数组,就是相同数据类型的元素按一定的顺序的集合,就是把有限个类型相同的变量用一个名字来命名,然后用编号区分他们的变量的集合,这个名字称为数组名,编号称为下标.组成数组的各个变量称为数组的分量 ...
- Struts2框架(5)---result结果集
result结果集 上一篇文章主要讲Struts2框架(4)---Action类访问servlet这篇主要讲result结果集 在Struts.xml中的result元素指的是:指定动作类的动作方法执 ...
- 大数据系列之Flume+HDFS
本文将介绍Flume(Spooling Directory Source) + HDFS,关于Flume 中几种Source详见文章 http://www.cnblogs.com/cnmenglang ...
- SVNManager配置
1.svn与apache的安装 yum install -y subversion httpd httpd.conf添加如下内容: LoadModule dav_svn_module module ...
- 3377: [Usaco2004 Open]The Cow Lineup 奶牛序列
3377: [Usaco2004 Open]The Cow Lineup 奶牛序列 Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 16 Solved ...
- Cordova原理一
我们知道cordova中js要和native通信都是通过 cordova plugin来实现的.如果我们自己创建一个cordova plugin,它其实就是几个独立的文件按照一定的目录结构放在一起,然 ...