<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Jquery表单验证</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<script src="js/jquery.validate.js" type="text/javascript"></script>
<script src="js/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
//$("#validatefrom") validatefrom表单id
$("#validatefrom").validate({
//根据id 调用
rules:{
province:{
required: true
},
city:{
required: true
},
area:{
required: true
},
s_name:{
required: true,
minlength: 2,
maxlength: 10
},
s_email:{
required: true,
email:true,
maxlength:30
},
s_address:{
required: true,
minlength: 5,
maxlength: 100
},
s_tel:{
required: true,
minlength: 7,
maxlength: 15
}
},
//重新修改消息
messages:{
province:{
required: "请选择省份"
},
city:{
required: "请选择城市"
},
area:{
required: "请选择区域"
},
s_name:{
required: "请填写姓名",
minlength:"姓名最少为2个字符",
maxlength:"姓名最长为10个字符"
},
s_email:{
//required: "<font color='red'>请填写邮箱</font>",
email:"请填写正确的格式",
maxlength:"邮箱最多30个字符"
},
s_address:{
required:"请填写收货地址",
minlength:"收货地址最少为5个字符",
maxlength:"收货地址最多为100个字符"
},
s_tel:{
required:"请填写电话号码",
minlength:"电话号码最少为5个字符",
maxlength:"电话号码最多为13个字符"
}
}
});
});
</script>
</head>
<body>
<form method="post" name="myfrom" id="validatefrom" action="http://www.baidu.com">
<input name="s_email" id="s_email" type="text" maxlength="4" class="input required email" />
<input type="submit" value="提交">
</form>
</body>
</html>
jquery自带表单验证
最新推荐文章于 2022-11-23 22:00:29 发布