jquery表单验证大全

JQuery笔记（表单验证大全）

jquery.validate.js 是 jquery 旗下的一个验证插件，借助 jquery 的优势，我们可以迅速验证一些常见的输入 , 并且可以自己扩充自己的验证方法。

举个例子，有这么一个表单：

view plaincopy to clipboardprint?

在这个表单中，有名、姓、用户名、密码、确认密码和 email 。他们都为非空，并且电子邮件需要是格式正确的地址、确认密码和密码一致。使用 jQuery 验证最简单的方式是引入 jquery.js 和 jquery validation.js 两个 js 文件。然后分别在 input 中加入 class 即：

view plaincopy to clipboardprint?

以下列出 validate 自带的默认验证

required: \必选字段 \

remote: \请修正该字段 \

email: \请输入正确格式的电子邮件 \

url: \请输入合法的网址 \

date: \请输入合法的日期 \

dateISO: \请输入合法的日期 (ISO).\

number: \请输入合法的数字 \

digits: \只能输入整数 \

creditcard: \请输入合法的信用卡号 \

equalTo: \请再次输入相同的值 \

accept: \请输入拥有合法后缀名的字符串 \

maxlength: jQuery.format(\请输入一个长度最多是 {0} 的字符串 \

minlength: jQuery.format(\请输入一个长度最少是 {0} 的字符串 \

rangelength: jQuery.format(\请输入一个长度介于 {0} 和 {1} 之间的字符串 \

range: jQuery.format(\请输入一个介于 {0} 和 {1} 之间的值 \

max: jQuery.format(\请输入一个最大为 {0} 的值 \

min: jQuery.format(\请输入一个最小为 {0} 的值 \

然后，在 document 的 read 事件中，加入如下方法：

这样，当 form 被提交的时候，就会根据 input 指定的 class 来进行验证了。如果失败， form 的提交就会被阻止。并且，将提示信息显示在 input 的后面。

不过，这样感觉不好，因为验证规则侵入了我们的 html 代码。还有一个方式，便是使用“ rules” 。我们将 input 的那些验证用 class 删除掉。然后修改 document 的 ready 事件响应代码：

$(document).ready(function(){

$(\

rules:{

firstname:\

lastname:\

username:\

password:\

confirm_password:{

required:true,

equalTo:\ },

email:{

required:true,

email:true } }

百度搜索“77cn”或“免费范文网”即可找到本站免费阅读全部范文。收藏本站方便下次阅读，免费范文网，提供经典小说综合文库jquery表单验证大全在线全文阅读。