jQuery validate使用。

step1 导入相应的库

         jquery.js

         jquery-validate.js

step2 填写验证规则

         $('#form').validate({

                   rules:{

                            username:{

                                     required:true,

                                     minlength:5

                            },

                            email:{

                                     required:true,

                                     email:true

                            },

                            comment:"required",

                            valcode:{

                                     formula:"2+3"

                            },

                            phone:"formula2"

                   },

                   messages:{

                            username:{

                                     required:"请输入用户名",

                                     minlength:"请至少输入五个字符"

                            },

                            comment:"请输入评论"

                   },

                   errorElement:"span", //用来创建错误提示信息的标签,可以是其它的标签。

                   success:function(label){

                            label.text("")                      //清空错误提示信息

                                     .addClass("success");      //加上自定义的success样式。

                   }

         });

         也可以创建自已的验证规则：

                   step1 定义验证方法

                            比如创建一个验证码

                            $.validator.addMethod(

                                     "formula", //验证方法名称

                                     function(value, element, param) {//验证规则

                                               //value:文本输入框的值

                                               //element:文本输入框本身

                                     },

                                               '请正确输入计算后的结果'//验证提示信息

                                     );

                            又比如创建一个验证电话号码的验证规则

                            $.validator.addMethod(

                                      "formula2", //验证方法名称

                                     function(value, element, param) {//验证规则

                                               var reg = /^\d{4}$/;

                                               return reg.test(value);

                                     },

                                     '请正确输入你的电话号码'

                            );

                   step2 使用 跟其它规则的使用方式一样。

         其它：

                   span.error {

                              background:url("../images/unchecked.gif") no-repeat 0px 0px;

                              padding-left: 16px;

                            }

                   span.success {

                         background:url("../images/checked.gif") no-repeat 0px 0px;

                         padding-left: 16px;

                   }