jQuery:validate添加自定义验证
jQuery.validator.addMethod添加自定义的验证规则
addMethod:name, method, message
简单实例:单个验证的添加
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>validate.js拓展验证</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<script type="text/javascript" src="validate.expand.js"></script>
</head>
<body>
<form action="" method="get" id="tinyphp">
<input type="text" value="" name="isZipCode" />
<input type="submit" value="提交" />
</form>
<script type="text/javascript">
$("#tinyphp").validate({
// 添加验证规则
rules: {
isZipCode: { //验证邮箱
isZipCode: true
}
}
});
</script>
</body>
</html>
validate.expand.js
jQuery.validator.addMethod("isZipCode", function(value, element) {
var tel = /^[0-9]{6}$/;
return this.optional(element) || (tel.test(value));
}, "请正确填写您的邮政编码");
=========================================================================
或看下面:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>validate.js拓展验证</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.validate.js"></script>
<script type="text/javascript" src="validate.expand.js"></script>
</head>
<body>
<form action="" method="get" id="tinyphp">
邮编:<input type="text" value="" name="isZipCode" /><br /><br /> 名字:<input type="text" value="" name="userName" />
<input type="submit" value="提交" />
</form>
<script type="text/javascript">
$("#tinyphp").validate({
// 添加验证规则
rules: {
isZipCode: { //验证邮箱
isZipCode: true
},
userName:{
required: true,
userName: true,
rangelength: [5,10]
}
}, //重设提示信息,可省略
messages:{
userName: {
required: "请填写用户名",
rangelength: "用户名必须在5-10个字符之间"
} }
});
</script>
</body>
</html>
validate.expand.js
jQuery.validator.addMethod("userName", function(value, element) {
return this.optional(element) || /^[\u0391-\uFFE5\w]+$/.test(value);
}, "用户名必须在5-10个字符之间");
jQuery.validator.addMethod("isZipCode", function(value, element) {
var tel = /^[0-9]{6}$/;
return this.optional(element) || (tel.test(value));
}, "请正确填写您的邮政编码");
jQuery:validate添加自定义验证的更多相关文章
- 封装jQuery Validate扩展验证方法
一.封装自定义验证方法-validate-methods.js /***************************************************************** j ...
- jquery validate remote验证唯一性
jquery.validate.js 的 remote 后台验证 之前已经有一篇关于jquery.validate.js验证的文章,还不太理解的可以先看看:jQuery Validate 表单验证(这 ...
- jquery validate扩展验证方法
/***************************************************************** jQuery Validate扩展验证方法 (linjq) *** ...
- 扩展jquery.validate自定义验证,自定义提示,本地化
<!DOCTYPE html> <html> <head> <meta name="viewport" content="wid ...
- 1)jquery validate 远程验证remote,自定义验证 , 手机号验证 2)bootstrap validate 远程remote验证的方法.
1)jquery validate 远程验证remote,自定义验证 1-1: js <script src="YYFramework/Public/js/jquery-3.1.1. ...
- jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因
jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因 今天利用了jquery.validate.js来验证表单,发现在火狐.谷歌浏览器当中都可以进行验证,但是在IE系列浏 ...
- 使用tooltip显示jquery.validate.unobtrusive验证信息
通过重写CSS实现使用tooltip显示jquery.validate.unobtrusive验证信息,效果如图: 1. 在ViewModel中定义验证规则 [Display(Name = " ...
- jQuery Validate Ajax 验证
jQuery Validate Ajax 验证 <script type="text/javascript"> $(function() { $('#formCityL ...
- jQuery Validate扩展验证方法 (zhangxiaobin)
/***************************************************************** jQuery Validate扩展验证方法 (zhangxiaob ...
随机推荐
- 15:django 缓存架构
动态网站的一个基本权衡就是他们是动态的,每次一个用户请求一个页面,web服务器进行各种各样的计算-从数据库查询到模板渲染到业务逻辑-从而生成站点访问者看到的页面.从处理开销的角度来看,相比标准的从文件 ...
- sharding-jdbc 实现分表
Sharding-JDBC 简介 Sharding-JDBC直接封装JDBC API,可以理解为增强版的JDBC驱动,旧代码迁移成本: 可适用于任何基于Java的ORM框架,如:JPA.HIberna ...
- How To Install Nginx on Ubuntu 16.04 zz
Introduction Nginx is one of the most popular web servers in the world and is responsible for hostin ...
- 三:基于Storm的实时处理大数据的平台架构设计
一:元数据管理器==>元数据管理器是系统平台的“大脑”,在任务调度中有着重要的作用[1]什么是元数据?--->中介数据,用于描述数据属性的数据.--->具体类型:描述数据结构,数据的 ...
- 从徐飞的文章《Web应用的组件化开发(一)中窥视web应用开发的历史
Web应用的组件化开发(一) 原文来自 徐飞 基本思路 1. 为什么要做组件化? 无论前端也好,后端也好,都是整个软件体系的一部分.软件产品也是产品,它的研发过程也必然是有其目的.绝大多数软件产品是追 ...
- SQL Server 用链接服务器 同步SqlServer与MySQL
=======================================================================================SQL SERVER链接S ...
- 02 java 基础:java 文件名与类名关系 CLASSPATH
java 类修饰符:通常情况下使用 public 修饰,此时,java 强制要求 .java 文件名需与该 public 修饰类名一致,否则无法编译通过.如若没有加修饰符,文件名与类名可无任何关联. ...
- hdu多校6
这个场要恶心死我了.. 1001 积分题,不要四舍五入 //#pragma comment(linker, "/stack:200000000") //#pragma GCC op ...
- linux在命令执行过程中ctrl +z 后[1]+ Stopped
进程挂起 stopped 代表有进程挂起 [1]是id号 可以通过Linux命令:jobs 查看挂起进程 fg 1 把任务1放到前台 bg 1 把任务1放到后台
- 【ASP.NET MVC】HTML5+MVC上传文件显示进度
head> <title>Index</title> <style type="text/css"> #statusBorder { po ...