validate自动校验

最新推荐文章于 2022-09-13 10:26:55 发布

iteye_7547

最新推荐文章于 2022-09-13 10:26:55 发布

阅读量165

点赞数

分类专栏： jquery 文章标签： html JavaScript validate ViewUI

本文链接：https://blog.csdn.net/iteye_7547/article/details/82673596

版权

jquery 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>自动校验功能</title>
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/validate.js"></script>
<style type="text/css">
.suc{
background-color: red;
}
</style>
<script type="text/javascript">
$(function() {
//自定义校验方法addMethod中的参数1:验证的方法名，参数2：验证规则，参数3：验证提示信息
$.validator.addMethod("formula",function(value,element,param){
return this.value == eval(param);
},'请正确输入数学计算正确后的结果');

$("#form1").validate({
rules:{
username:{
required:true,
minlength:2
},
email:{
required:true,
email:true
},
url:{
required:true,
url:true
},
valcode:{
formula: "7+9"
}
},
/* messages{
username:{
required:'请输入姓名',
minlength:'请至少输入两个字符'
},
email:{
required:'请输入电子邮箱',
email:'请检查电子邮箱格式'
}
}, */
/*
errorElement:"em",//用来创建错误提示信息
success:function(label){//验证成功后执行的回调函数，label指向上面那个错误提示信息标签em
label.text(" ").addClss("suc");//清空错误提示信息,并添加上样式
} */
});
});
</script>
</head>
<body>
<form action="#" method="post" id="form1">
用户名:<input type="text" name="username" value=""><br><br>
年龄:<input type="text" name="age" value=""><br><br>
邮箱:<input type="text" name="email" value=""><br><br>
地址:<input type="text" name="url" value=""><br><br>
<label for="cvalcode">验证码:</label>
<input id="cvalcode" type="text" name="valcode" size="25" value="">=7+9
<input type="button" value="提交">
</form>
</body>
</html>

iteye_7547

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
validate自动校验

自动校验功能.suc{background-color: red;} $(function() { //自定义校验方法addMethod中的参数1:验证的方法名，参数2：验证规则，参数3：验证提示信息 $.validator.addMethod("formula",function(value,element,param){ ...
复制链接

扫一扫