<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.error{
color: red;
font-size:12px;
}
</style>
<script type="text/javascript" src="C:\Users\Administrator\Desktop\jquery-3.3.1.js"></script>
<script type="text/javascript" src="C:\Users\Administrator\Desktop\jquery-validation-1.17.0\dist\jquery.validate.js"></script>
<script type="text/javascript" src="C:\Users\Administrator\Desktop\jquery-validation-1.17.0\src\localization\messages_zh.js"></script>
<script type="text/javascript">
$().ready(function (){
$("#commentForm").validate({
rules:{
userName:{
required:true,
minlength:3
},
email:{
required:true,
email:true,
},
age:{
digits:true,
min:18,
max:100
}
}
})
})
</script>
</head>
<body>
<form class="cmxform" id="commentForm" method="get" action="">
<fieldset>
<legend>输入你的名字,邮箱,年龄,URL,爱好。</legend>
<p><label>姓名 : </label><input type="" name="userName"></p>
<p><label>邮箱 : </label><input type="" name="email"></p>
<p><label>年龄 : </label><input type="" name="age"></p>
<p><label>网址 : </label><input type="" name="url"></p>
<p><label>爱好 : </label><textarea name="love"></textarea></p>
<p><input class="submit" type="Submit" name="" value="Submit"></p>
</fieldset>
</form>
</body>
</html>
$.extend($.validator.messages,{
required: "这是必填字段",
remote: "请修正此字段",
email: "请输入有效的电子邮件地址",
url: "请输入有效的网址",
date: "请输入有效的日期",
dateISO: "请输入有效的日期 (YYYY-MM-DD)",
number: "请输入有效的数字",
digits: "只能输入数字",
creditcard: "请输入有效的信用卡号码",
equalTo: "你的输入不相同",
extension: "请输入有效的后缀",
maxlength: $.validator.format("最多可以输入 {0} 个字符"),
minlength: $.validator.format("最少要输入 {0} 个字符"),
rangelength: $.validator.format("请输入长度在 {0} 到 {1} 之间的字符串"),
range: $.validator.format("请输入范围在 {0} 到 {1} 之间的数值"),
max: $.validator.format("请输入不大于 {0} 的数值"),
min: $.validator.format("请输入不小于 {0} 的数值")
});