引入JS
<script src="~/Scripts/jquery-1.10.2.min.js"></script> <script src="~/Scripts/jquery.validate.js"></script>
加载自定义验证
<script> $(document).ready(function () { $("#formid").validate({ rules: { username: { required: true, minlength: 8 }, price: { required: true, digits: true } }, messages: { username: { required: "必须填写", minlength: "最少8个字符" }, price: { required: "必须填写", digits: "必须填写整数" } },
errorElement: "em",
success: function (label) {
label.text("OK").addClass('success')
} }); }); </script>
完整页面代码:
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Rep</title>
<style>
em.error {
background-color:blue;
background: url("images/unchecked.gif") no-repeat 0px 0px;
padding-left: 16px;
}
em.success {
background-color:red;
background: url("images/checked.gif") no-repeat 0px 0px;
padding-left: 16px;
}
</style>
<script src="~/Scripts/jquery-1.10.2.min.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script>
$(document).ready(function () {
$("#formid").validate({
rules: {
username: { required: true, minlength: 8 },
price: { required: true, digits: true }
},
messages: {
username: { required: "必须填写", minlength: "最少8个字符" },
price: { required: "必须填写", digits: "必须填写整数" }
},
errorElement: "em",
success: function (label) {
label.text("OK").addClass('success')
}
});
});
</script>
</head>
<body>
<form id="formid">
<input id="username" name="username" size="25" value="" />
<input id="price" name="price" size="25" value="" />
<input id="Submit1" type="submit" class="submit" value="submit" />
</form>
</body>
</html>
设置的规格
序号 规则 描述 1 required:true 必须输入的字段。 2 remote:"check.php" 使用 ajax 方法调用 check.php 验证输入值。 3 email:true 必须输入正确格式的电子邮件。 4 url:true 必须输入正确格式的网址。 5 date:true 必须输入正确格式的日期。日期校验 ie6 出错，慎用。 6 dateISO:true 必须输入正确格式的日期（ISO），例如：2009-06-23，1998/01/22。只验证格式，不验证有效性。 7 number:true 必须输入合法的数字（负数，小数）。 8 digits:true 必须输入整数。 9 creditcard: 必须输入合法的信用卡号。 10 equalTo:"#field" 输入值必须和 #field 相同。 11 accept: 输入拥有合法后缀名的字符串（上传文件的后缀）。 12 maxlength:5 输入长度最多是 5 的字符串（汉字算一个字符）。 13 minlength:10 输入长度最小是 10 的字符串（汉字算一个字符）。 14 rangelength:[5,10] 输入长度必须介于 5 和 10 之间的字符串（汉字算一个字符）。 15 range:[5,10] 输入值必须介于 5 和 10 之间。 16 max:5 输入值不能大于 5。 17 min:10 输入值不能小于 10。