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添加自定义验证的更多相关文章

  1. 封装jQuery Validate扩展验证方法

    一.封装自定义验证方法-validate-methods.js /***************************************************************** j ...

  2. jquery validate remote验证唯一性

    jquery.validate.js 的 remote 后台验证 之前已经有一篇关于jquery.validate.js验证的文章,还不太理解的可以先看看:jQuery Validate 表单验证(这 ...

  3. jquery validate扩展验证方法

    /***************************************************************** jQuery Validate扩展验证方法 (linjq) *** ...

  4. 扩展jquery.validate自定义验证,自定义提示,本地化

    <!DOCTYPE html> <html> <head> <meta name="viewport" content="wid ...

  5. 1)jquery validate 远程验证remote,自定义验证 , 手机号验证 2)bootstrap validate 远程remote验证的方法.

    1)jquery  validate 远程验证remote,自定义验证 1-1: js <script src="YYFramework/Public/js/jquery-3.1.1. ...

  6. jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因

    jquery.validate.js 验证表单时,在IE当中未验证就直接提交的原因 今天利用了jquery.validate.js来验证表单,发现在火狐.谷歌浏览器当中都可以进行验证,但是在IE系列浏 ...

  7. 使用tooltip显示jquery.validate.unobtrusive验证信息

    通过重写CSS实现使用tooltip显示jquery.validate.unobtrusive验证信息,效果如图: 1. 在ViewModel中定义验证规则 [Display(Name = " ...

  8. jQuery Validate Ajax 验证

    jQuery Validate Ajax 验证 <script type="text/javascript"> $(function() { $('#formCityL ...

  9. jQuery Validate扩展验证方法 (zhangxiaobin)

    /***************************************************************** jQuery Validate扩展验证方法 (zhangxiaob ...

随机推荐

  1. 怎么删除Windows服务

    1,首先找到服务名字. 2,在cmd中进到c:下面 3,sc delete 名字. 删除成功

  2. Tomcat手动指定jdk路径

    Windows系统: 修改bin下的setclasspath.bat,在开头处添加: rem set specific jdkset JAVA_HOME=%CATALINA_HOME%\jdk1.8. ...

  3. [图解算法]线性时间选择Linear Select——<递归与分治策略>

    #include <ctime> #include <iostream> using namespace std; template <class Type> vo ...

  4. “无法识别的配置节system.webServer”解决办法

    在Winsows 2008 Server 上安装asp.net 1.1 的应用程序,在启用默认文档或者浏览目录时会向 web.config 文件添加 <system.webServer> ...

  5. bootstrap中如何多次使用一个摸态框

    /**弹出框设置**/ function showjcziimodal(url, width) { $("#jczii-modal").remove();//如果存在此Id的Mod ...

  6. poj1743 后缀数组, poj挂了 存个代码

    #include<bits/stdc++.h> #define LL long long #define fi first #define se second #define mk mak ...

  7. vue-music 关于Search(搜索页面)-- 搜索结果优化

    搜索结果 列表点击跳转到相应的歌手详情页或者 歌曲页面,通过子路由跳转,和singer 组件一样 在suggest.vue 组件判断如果点击的是歌手,则new 一个歌手对象,通过这个对象的id 属性值 ...

  8. POJ 2253 Frogger【最短路变形/最小生成树的最大权/最小瓶颈树/A到B多条路径中的最小的最长边】

    Freddy Frog is sitting on a stone in the middle of a lake. Suddenly he notices Fiona Frog who is sit ...

  9. Web框架以及两种模式MVC,MTV

    一.Web框架的本质 众所周知,对于所有的Web应用,本质上其实就是一个socket服务端,用户的浏览器其实就是一个socket客户端. import socket def handle_reques ...

  10. 查看Linux系统资源占用

    Linux查看进程占用磁盘IO yum install -y itop iotop -oP Linux查看进程网络使用 yum install -y nethogs nethogs nethogs e ...