引入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。
时间: 2024-10-15 08:03:58