validate插件实现表单效验（二）
2024-09-28 05:30:38
一款优秀的表单验证插件——validation插件
特点：
l 内置验证规则：拥有必填、数字、email、url和信用卡号码等19类内置验证规则
l 自定义验证规则：可以很方便的自定义验证规则
l 简单强大的验证信息提示：默认了验证信息提示，并提供自定义覆盖默认提示信息的功能
l 实时验证：可以通过keyup或bulr事件触发验证，而不仅仅在表单提交的时候验证。
下载：
http://bassistance.de/jquery-plugins/jquery-plugin-validation/
快速入门：
第一步：引入jquery库和validation插件
案例：
<script type="text/javascript" src="../../js/jquery-1.11.0.min.js" ></script>
<script type="text/javascript" src="../../js/jquery.validate.min.js" ></script>
<script type="text/javascript" src="../../js/messages_zh.js" ></script>
<script>
$(function(){
$("#registForm").validate({
rules:{
user:{
required:true,
minlength:2
},
password:{
required:true,
digits:true,
minlength:6
},
repassword:{
required:true,
digits:true,
minlength:6,
equalTo:"[name='password']"
},
email:{
required:true,
email:true
},
username:{
required:true,
minlength:2
},
sex:{
required:true
}
},
messages:{
user:{
required:"用户名不能为空!",
minlength:"用户名不得少于2个字符!"
},
password:{
required:"密码不能为空!",
digits:"密码必须是数字!",
minlength:"密码长度不得低于6位!"
},
repassword:{
required:"确认密码不能为空!",
digits:"密码必须是数字!",
minlength:"密码长度不得低于6位!",
equalTo:"两次密码不一致!"
},
email:{
required:"邮箱不能为空!",
email:"邮箱格式不正确!"
},
username:{
required:"姓名不能为空!",
minlength:"姓名不得少于2个字符!"
},
sex:{
required:"性别必须勾选!"
}
},
errorElement: "label", //用来创建错误提示信息标签
success: function(label) { //验证成功后的执行的回调函数
//label指向上面那个错误提示信息标签label
label.text(" ") //清空错误提示消息
.addClass("success"); //加上自定义的success类
}
});
})
</script>
最新文章
- Linux平台oracle 11g单实例 安装部署配置 快速参考
- c#面向对象基础技能——学习笔记（五）委托技术在开发中的应用
- JavaEE学习文章汇总-ssm框架
- Ruby中 Include, Extend, Import, Require 的使用区别
- input常用属性
- VC亲自教你写BP
- CSS样式表继承详解
- 前App Store高管揭秘：关于“苹果推荐”的七大真相
- 这篇博客的内容基本没见过，mark 一下以后可以学习
- 什么是Hadoop，怎样学习Hadoop
- JS 计算日期天数差
- PAT 1014
- myeclipse设置技巧
- MSSQL 导入导出文本文件
- ThoughtWorks开发持续集成及部署利器:Go
- 后台如何解析json
- (一)初识Redis
- java 与 CDH kafka集成
- 机器学习（四）--------逻辑回归(Logistic Regression)
- vue webpack打包 -webkit-box-orient 失效