validate验证
Posted xue_yun_xiang
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了validate验证相关的知识,希望对你有一定的参考价值。
概述
作用就是对输入的数据,立即进行校验,查看是否复合要求
validate: jquery的一个插件,依赖jquery使用,Validation是历史最悠久的jQuery插件之一,经过了全球范围内不同项目的验证,并得到了许多Web开发者的好评。
- 内置验证规则
- 简单强大的验证信息提示
- 实时验证
属性 | 描述 |
---|---|
required:true | 必输字段 |
remote:“check.php” | 使用ajax方法调用check.php验证输入值 |
email:true | 必须输入正确格式的电子邮件 |
url:true | 必须输入正确格式的网址 |
date:true | 必须输入正确格式的日期 日期校验ie6出错,慎用 |
dateISO:true | 必须输入正确格式的日期(ISO),例如:2009-06-23,1998/01/22 只验证格式,不验证有效性 |
number:true | 必须输入合法的数字(负数,小数) |
digits:true | 必须输入整数 |
creditcard: | 必须输入合法的信用卡号 |
equalTo:"#field" | 输入值必须和#field相同 |
accept: | 输入拥有合法后缀名的字符串(上传文件的后缀) |
maxlength:5 | 输入长度最多是5的字符串(汉字算一个字符) |
minlength:10 | 输入长度最小是10的字符串(汉字算一个字符) |
rangelength:[5,10] | 输入长度必须介于 5 和 10 之间的字符串")(汉字算一个字符) |
range:[5,10] | 输入值必须介于 5 和 10 之间 |
max:5 | 输入值不能大于5 |
min:10 | 输入值不能小于10 |
安装
<!--
一定要先引入 jquery
-->
<script src="js/jquery-3.4.1.min.js"></script>
<!-- 引入validate -->
<script src="js/validate.min.js"></script>
<!-- 对应 validate 中文提示 -->
<script src="js/messages_zh.js"></script>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--
引入validate 校验库 validate 依赖jquery
-->
<!--
一定要先引入 jquery
-->
<script src="js/jquery-3.4.1.min.js"></script>
<!-- 引入validate -->
<script src="js/validate.min.js"></script>
<!-- 对应 validate 中文提示 -->
<script src="js/messages_zh.js"></script>
</head>
<body>
<form id="form1">
id:<input type="number" id="id" name="id" /><br />
name:<input type="text" id="name" name="name" /><br />
email:<input type="text" id="email" name="email" /><br />
</form>
<script>
$(function(){
$('#form1').validate({
rules:{
id:{ // 对id 限制规则
required:true,
digits:true, // 必须是整数
range:[1,100]
},
name:{
required:true,
minlength:10 // 最小长度
},
email:{
required:true,
email:true // 校验邮箱格式
}
},
messages:{
id:"请输入正确的id格式",
name:"请输入正确name 格式",
email:"请输入正确的邮箱"
}
}
)
})
</script>
</body>
</html>
以上是关于validate验证的主要内容,如果未能解决你的问题,请参考以下文章