jquery验证插件validate自定义扩展
<script src="${pageContext.request.contextPath}/resources/js/jquery-1.12.0.min.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/resources/js/jquery.validate.min.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/resources/js/messages_zh.js" type="text/javascript"></script>
<form class="am-form" id="mechantForm" class="doc-vld-msg">
<div class="am-form-group">
<label for="doc-ipt-name-1" class="labelname">厂商名称:</label>
<input type="text" id="merchantName" name="merchantName" minlength="3" placeholder="输入厂商名称" required/>
</div>
<div class="am-form-group">
<label for="doc-ipt-name-1" class="labelname">姓名:</label>
<input type="text" name="name" id="name" placeholder="请输入姓名">
</div>
<div class="am-form-group">
<label for="doc-ipt-phone-1" class="labelname">电话:</label>
<input type="text" name="telphone" id="telphone" placeholder="请输入电话">
</div>
<div class="am-form-group">
<label for="doc-ipt-phone-1" class="labelname">公司地址:</label>
<input type="text" name="address" id="address" placeholder="请输入公司地址">
</div>
<div style="margin-left:15%;margin-top:27px;">
<button style="margin-right:20px;" type="button" data-am-modal-close class="mybtn">关闭</button>
<button type="submit" class="mybtn" id='saveBtn'>确定</button>
</div>
</form>
js部分:
jQuery.validator.addMethod("isMobile", function(value, element) {
var length = value.length;
var mobile = /^1[34578]\d{9}$/;/*/^1(3|4|5|7|8)\d{9}$/*/
return this.optional(element) || (length == 11 && mobile.test(value));
}, "请正确填写您的手机号码");
$("#saveBtn").click(function() {
$("#mechantForm").validate({
submitHandler: function(form){
$.ajax({
cache : true,
type : "POST",
url : "merchant",
data : $('#mechantForm').serialize(),
async : false,
error : function(data) {
layer.alert('系统错误', {icon: 0});
},
success : function(data) {
layer.alert('保存成功', {icon: 1});
$('#mechantForm')[0].reset();
}
});
},
rules: {
merchantName: {
required: true,
minlength: 3
},
name:{
required: true,
minlength: 2
},
telphone:{
required: true,
minlength: 11,
maxlength:11,
digits:true,
number:true,
isMobile : true
},
address:{
required: true,
maxlength:50
}
},
messages: {
merchantName: {
required: "不能为空",
minlength: "不能少于3个字符"
},
name:{
required: "不能为空",
minlength: "不能少于2个字符"
},
telphone:{
required: "不能为空",
minlength: "必须11位数字",
maxlength:"必须11位数字",
digits:"必须是数字" ,
number:"请输入有效数字",
isMobile : "手机号格式错误"
},
address:{
required:'不能为空',
maxlength:"不能多于50个字符"
}
}
});
});
jquery验证插件validate自定义扩展的更多相关文章
- jQuery验证插件 Validate详解
1.引入必要的文件,以及语言中文提示包 2.使用规则如下: 序号 规则 描述 1 required:true 必须输入的字段. 2 remote:"check.php" 使用 aj ...
- jquery 验证插件 validate
1)required:true 必输字段(2)remote:"check.php" 使用ajax方法调用check.php验证输入值(3)email:true 必须输入正确格式的电 ...
- 表单验证插件——validate
表单验证插件——validate 该插件自带包含必填.数字.URL在内容的验证规则,即时显示异常信息,此外,还允许自定义验证规则,插件调用方法如下: $(form).validate({options ...
- jQuery验证插件
原文:jQuery验证插件 学习要点: 1.使用 validate.js 插件 2.默认验证规则 3.validate()方法和选项 4.validate.js 其他功能 验证插件(validate. ...
- jQuery Validate 表单验证插件----Validate简介,官方文档,官方下载地址
一. jQuery Validate 插件的介绍 jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求.该插件捆 ...
- jQuery应用一之验证插件validate的使用
综述 validate是一个用来验证表单提交的插件,应用十分广泛,具有如下的几个功能 自带了基本的验证规则 提供了丰富的验证信息提示功能 多种事件触发验证 自定义验证规则 下面我们就来感受一下这个插件 ...
- Jquery表单验证插件validate
写在前面: 在做一些添加功能的时候,表单的提交前的验证是必不可少的,jquery的validate插件就还可以,对于基本的需求已经够了.这里记录下基本的用法. 还是写个简单的demo吧 <htm ...
- 第九章 jQuery验证插件简介
1. 表单验证插件-----Validation <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ...
- jQuery验证插件使用初步
validate是一款优秀的表单验证插件,其初步使用方法如下: (1)前台页面代码: <form id="form1" runat="server"> ...
随机推荐
- 框架开发之Java注解的妙用
注解的好处:1.能够读懂别人写的代码,特别是框架相关的代码.2.本来可能需要很多配置文件,需要很多逻辑才能实现的内容,就可以使用一个或者多个注解来替代,这样就使得编程更加简洁,代码更加清晰.3.(重点 ...
- CAS机制总结
一.简介 CAS机制:(Compare and set)比较和替换 简单来说–>使用一个期望值来和当前变量的值进行比较,如果当前的变量值与我们期望的值相等,就用一个新的值来更新当前变量的值CAS ...
- CAD控件,CAD插件使用教程:Android开发使用控件--开发环境的搭建
Android开发使用控件入门--环境搭建 2014-12-24 09:57 14人阅读 评论(0) 收藏 编辑 删除 CAD控件.CAD三维控件,手机 ...
- js文字内容部分选中的代码封装
var textSelect = function(o, a, b){ //o是当前对象,例如文本域对象 //a是起始位置,b是终点位置 var a = parseInt(a, 10), b = pa ...
- Python之文件处理-批量修改md文档内容
目录 Python之文件处理-批量修改md文档内容 Python之文件处理-批量修改md文档内容 #!/usr/bin/env python # -*- coding:utf-8 -*- import ...
- UVA - 10976 分数拆分
题意: 给定正整数k(1<=k <= 10000),找出所有正整数 x>= y, 使得1/k = 1/x + 1/y 分析: 因为 x >= y 所以 1/x <= 1/ ...
- 【】node基础概念问题(转载)
1.nodejs编写HelloWord,了解什么是nodejs,nodejs有什么特点 2.nodejs的模块怎么用,如何载入别的模块(require),如何给另一模块调用(module, mod ...
- HDU 3602 2012【01 背包变形】
题意: 有 n 个团队和 m 艘船,每艘船的载客量为 k,每个团队的人数为ai+1 ,转载该团队可获利润 bi,要求每个团队的所有人必须在同一艘船上, 且团队优先级高的团队所在船编号不能大于优先级低的 ...
- Linux下汇编语言学习笔记33 ---
这是17年暑假学习Linux汇编语言的笔记记录,参考书目为清华大学出版社 Jeff Duntemann著 梁晓辉译<汇编语言基于Linux环境>的书,喜欢看原版书的同学可以看<Ass ...
- Thinkphp5.0 控制器向视图view赋值
Thinkphp5.0 控制器向视图view的赋值 方式一(使用fetch()方法的第二个参数赋值): <?php namespace app\index\controller; use thi ...