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 ...
随机推荐
- cf Sereja and Array
http://codeforces.com/contest/315/problem/B #include <cstdio> #include <cstring> #includ ...
- JavaScript对象基础知识
1.对象所包含的元素一组包含数据的属性.如人的名字.书的价格和手机型号等.允许对属性中所包含的数据进行操作的方法. 2.引用对象的途径一个对象真正地被使用,可以采用以下几种方式.引用Javascrip ...
- 深入理解7816(3)-----关于T=0
卡片和终端之间的数据传输是通过命令响应的方式进行的,卡片只能被动地接收命令,并且给出响应.所有的命令都是以命令头开始,而该命令被完整地执行后(无论结果对错),必须以包含状态字(SW1 SW2)的响应结 ...
- Cmake Error: your compiler "cl" was not Found .etc
又是环境变量路径等问题,烦死人了. TIPS:请注意,控制台的窗口也有自己的环境变量,从系统环境变量和用户环境变量继承过来的,一个窗口(控制台)可以添加属于自己的环境变量(跟别的控制台窗口没关系) 解 ...
- (转) Linux的capability深入分析(2)
一)capability的工具介绍 在我们的试验环境是RHEL6,libcap-2.16软件包中包含了相关的capability设置及查看工作,如下: rpm -ql libcap-2.16- ...
- rnqoj-30- [stupid]愚蠢的矿工-树形DP
把树转化为二叉树,然后再左右DP: #include<stdio.h> #include<string.h> #include<iostream> #include ...
- Memcached和Redis异同
在考虑对应用程序的性能表现进行提升时,缓存机制往往是解决问题的重要起点,而Memcached与Redis则经常被作为初步方案来加以比较.这两套声名显赫的缓存引擎拥有着诸多相似之处,但它们同样也具备大量 ...
- jQuery实现置顶和置底特效
原文地址:http://www.jqueryba.com/3403.html <script src="jquery.min.js" type="text/java ...
- Jquery使用tbody编辑功能实现table输入计算功能
实例:编写一个输入计算(被减数-减数=差). HTML: <body> <table> <thead> <tr> <td >被减数</ ...
- hdu1540-Tunnel Warfare (线段树区间合并)
题意:n个村庄,有三种操作,D x 破坏位置为x的村庄,R 修复上一次被破坏的村庄,Q x 输出含有x村庄的连续村庄的最大个数.线段树搞之,区间合并. ls[maxn]为当前节点左面的连续区间,rs[ ...