jquery的validate最基础使用总结

一、引入的js

<script src="js/common/jquery-1.11.3.min.js"></script>

<script type="text/javascript" src="query-validation/js/jquery.validate.min.js"></script>

二、html写form的规则

form中的input要加上name="XX"，当使用$("form").serialize()时，会找name的标签去取值哦。

（注意：如果input标签设置为disabled后加上了name，不会被序列化哦，readonly属性可以序列化）

三、添加验证规则

方法一：在js中添加验证规则

$("form").validate({
        rules: {
               name: {
                      minlength: 2,
                      maxlength: 64,
                      required: true
                },
                pricefactor: {
                     number:true ,
                     required: true
                },
                effectivetime: {
                     required: false,
                      date:true
                },
                'payment[]': {
                    required: true,
                    minlength: 1
                }
            },
            messages: {

name:{

maxlength: $.validator.format("最多 {0} 个字"),
minlength: $.validator.format("最少 {0} 个字"),

},
                'payment[]': {
                    required: "Please select at least one option",
                    minlength: jQuery.validator.format("Please select at least one option")
                }
            },
        });

方法二：在html中添加验证属性

<input type="text"  name="displayname" placeholder="" required minlenght="2">

还有很多规则，见文章最后附录

四、自定义验证规则

$.validator.addMethod("mobile",function(value,element,params){
            return /^(13|15|18)\d{9}$/i.test(value)
            },"手机格式不正确");

使用：

phone: {
         required: true,
         mobile: $("#submit_form").find("input[name='phone']").val()
},

五、整页表单验证是否全部通过

var res = $("#submit_form").valid();

如果res为false就未通过，不进行下面的操作。