jQuery验证表单格式
工作之余整理一些工作中编写的代码,记录自己工作中的技术要点,便于自己记忆已经整合。以下是关于此jQuery验证的一些标记以及使用方法:
整个js代码都放入jquery_validate_1.1.0.js中,通过一个匿名函数,jQuery的扩展方法,扩展方法为:initValidate函数,方法中带一个options配置参数,目前配置参数只有一个属性,{handlerUrl:""},提供是否需要后台请求验证的url地址。只需要对取验证的DOM绑定$("ID").initValidate(options)。通过给input控件添加自定义属性,自定义属性规则如下:
<div id="panda">
<input type="text" validate="true" ctr-type="mobile" />
</div>
以上一个简单的demo是验证输入格式是否为手机号,如果输入的信息不符合规则,错误信息会提示在输入框下一行,如下图:

validate="true" // 执行验证,这个不设置为true其他属性都不验证;
isrequired="true" // 必填验证
checkunique="true" // 后台Ajax唯一性验证,如果不唯一则验证失败;
ctr-type="email" // 格式是email, pwd:密码,char:姓名,number:数字,float:带小数的数字,mobile:手机,idcard:身份证;
repeatpwd="true" // 密码重复性检验,这个标签必须同时出现在两个需要检验的密码和重复输入密码控件。
初始化示例:
$('#panda').initValidate();
提交按钮提交之前对所有输入进行验证:
$('.okbtn').click(function () { return $('#panda').validateAllControls() });
Email验证使用示例:
<input type="text" ctr-type="email" checkunique="true" isrequired="true" validate="true" name="myEmail" id="myEmail"/>
<label class="error"></label>
密码验证使用示例:
<input type="password" ctr-type="pwd" isrequired="true" validate="true" repeatpwd="true" name="newPassword"/>
<label class="error"></label>
以上的验证,前提条件是validate="true",这个属性是验证其他规则的一切,如果没有设置这个属性,其他的任何设置都不会验证。此jquery验证为光标失去焦点的验证事件。
如果需要手动调用验证的话,调用单独的验证方法:$("#panda").validateAllControls(options);输入框的自定义以上面一样设置。
文件的url路径:http://files.cnblogs.com/files/panda-/jquery_validate_1.1.0.js,点击查看,不知道怎么添加压缩文件,这边留下一个url路径,为以后自己备份一份。
jQuery验证表单格式的更多相关文章
- jQuery ------------> 验证表单
简单的东西重复做,做多了之后,才能说熟能生巧. 做好一个精美的页面,固然是好,但是,一个页面除了写好之外,我们更需要的是将其功能完善.比如表单的验证,这只是众多工作之一.然后本次就以jQuery的va ...
- jquery 验证表单信息
/** * $().validate(json); * *rules:自定义规则 * *messages:提示信息 */ $(document).ready(function(){ $(". ...
- jquery验证表单是否满足正则表达式是否通过验证例子
//验证通用函数 a表示元素对象,b表示正则表达式,c存bool值 function testyz(a,b,c){ c=false; $(a).on("blur",function ...
- jquery验证表单代码
代码如下: //开始验证-修改用户密码 $('.editUserPwd').validate({ /**//* 设置验证规则 */ rules: { lname:{ required:true, st ...
- JQuery基础原理 与实例 验证表单 省市联动 文本框判空 单选 复选 判空 下拉判空 确认密码判等
JQuery 基础原理 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...
- jquery插件-表单验证插件
JQuery 插件概述: 插件(plugin)也被成为扩展,是一种遵循一定规范的应用程序编写出来的程序,JQuery有大量 现成的插件. 一句话,JQuery插件就是别人依照Jquery官方规范写好的 ...
- 用 jQuery 实现表单验证(摘抄)
——选自<锋利的jQuery>(第2版)第5章的例题 5.1.5 表单验证 表单作为 HTML 最重要的一个组成部分,几乎在每个网页上都有体现,例如用户提交信息.用户反馈信息和用户查询信 ...
- jQuery formValidator表单验证插件
什么是jQuery formValidator? jQuery formValidator表单验证插件是客户端表单验证插件. 在做B/S开发的时候,我们经常涉及到很多表单验证,例如新用户注册,填写个人 ...
- 运用jQuery写的验证表单
//运用jQuery写的验证表单 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...
随机推荐
- 《VIM-Adventures攻略》 LEVEL 4、5
本文已转至http://cn.abnerchou.me/2014/03/10/46d23509/ 上一篇文章忘记说明文本编辑器的模式: 所有文本编辑器都至少有两种模式,编辑模式和控制模式.编辑模式就是 ...
- 调用Android系统设置中的Intent
开发Android软件时,常常需要打开系统设置或信息界面,来设置相关系统项或查看系统的相关信息,这时我们就可以使用以下语句来实现:(如打开“无线和网络设置”界面) Intent intent = ne ...
- android and javascript
layout-------->HTML activity-------->JavaScript R资源管理者----------->layout, string, styles, c ...
- Borland license information was found,but it is not valid for delphi.
The start Delphi7 come amiss: Borland license information was found,but it is not valid for delphi. ...
- Android获取当前时间与星期几
public class DataString { private static String mYear; private static String mMonth; private static ...
- SOSP 文档 - Windows Azure 存储:具有强一致性的高可用性云存储服务
之前,我们在第 23 届 ACM操作系统原理研讨会 (SOSP)上发布了一篇文章,其中介绍了 Windows Azure存储的内部详细信息. 您可以在此处找到该文章.此次大会还发布了一段视频讲话( ...
- 华为手机root 删除一般不用软件 的命令
上个B518海外版的一键root精简 精简了以下这些,不想删除的自己可以在刷机脚本中删除对应行就行了,音量解锁,GPS,搜索键关屏,root,添加钛备份4.0,re管理器,其他框架未改动,稳定性不会变 ...
- Mac系统升级到10.9(mavericks)时安装php扩展问题解决(转)
问题一: 执行执行 phpize 报错: grep: /usr/include/php/main/php.h: No such file or directory grep: /usr/include ...
- 从有限状态机的角度去理解Knuth-Morris-Pratt Algorithm(又叫KMP算法)
转载请加上:http://www.cnblogs.com/courtier/p/4273193.html 在开始讲这个文章前的唠叨话: 1:首先,在阅读此篇文章之前,你至少要了解过,什么是有限状态机, ...
- javascript笔记2之数据类型
/* var box; alert(typeof box); //box是Undefined类型,值是undefined,类型返回的字符串是undefined var box = true; aler ...