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 ...
随机推荐
- Visual Studio下Qt编程中对中文的处理
Visual Studio下Qt编程中对中文的处理 本文为原创文章,原文地址http://www.cnblogs.com/c4isr/p/qt_develop_in_vs.html Visual St ...
- 【杭州图铭科技有限公司招募贴】——“JUST DO IT”
I'm convinced that the only thing that kept me going was that I loved what I did. ——Steve Paul Jobs( ...
- cp 提示 overwrite 问题
cp 提示 overwrite 问题 copy -f 文件的时候仍然提示覆盖问题,很诧异,咨询SA,果然 cp -i 强制要求覆盖文件的时候确认,-f 也不起作用,大大的不爽[root@erpappd ...
- c#秒转时分秒
2个办法 @{ int hour = item.track / 3600; int min = (item.track - hour * 3 ...
- (greedy)Best Time to Buy and Sell Stock II
Say you have an array for which the ith element is the price of a given stock on day i. Design an al ...
- hdu2082:简单母函数
题目大意: a,b,c,d...z这些字母的价值是1,2,3......26 给定 这26个字母分别的数量,求总价值不超过50的单词的数量 分析: 标准做法是构造母函数 把某个单词看作是,关于x的多项 ...
- Entity framework - start
http://blogs.msdn.com/b/adonet/archive/2010/07/19/absolue-beginners-guide-to-entity-framework.aspx?R ...
- java_抽象类应用
本例子通过一个实例来具体阐述抽象类的应用,首先一个抽象类Person2,里面定义了一些人的共有属性(年龄,姓名),和抽象方法want(),want()方法来具体实现不同的人的需求(学生想要成绩,工人想 ...
- 自写图片遮罩层放大功能jquery插件源代码,photobox.js 1.0版,不兼容IE6
阿嚏~~~ 话说本屌丝没啥开发插件的经验,可是天公不作美,公司须要让我自己开发个图片放大的插件 但公司老大的话,宛如吾皇之圣旨,微臣必当肝脑涂地,莫敢不从啊~~~ 于是乎,作为一个超级小白,本人仅仅能 ...
- unity的坑
http://dearymz.blog.163.com/blog/static/20565742013341916919/ 编辑器: Hierarchy窗口中是场景中的Game Object列表 Pr ...