jquery.validate使用

最近做一个项目需要画表单，然后验证考虑使用jquery.validate来验证。一下是项目的一些心得体会：
第一步引入js：

    <script type="text/javascript" src="js/jquery.validate.js"></script>

第二步：验证写在了js上，书写的代码如下：

            //让当前表单调用validate方法，实现表单验证功能
            $("#ff").validate({
                debug:true, //调试模式，即使验证成功也不会跳转到目标页面
                rules:{     //配置验证规则，key就是被验证的dom对象，value就是调用验证的方法(也是json格式)
                    sname:{
                        required:true,  //必填。如果验证方法不需要参数，则配置为true
                        rangelength:[4,12],
                        remote:{
                            url:"ajax_check.action",
                            type:"post"
                        }
                    },
                    spass:{
                        required:true,
                        rangelength:[6,16]
                    },
                    spass2:{
                        required:true,
                        equalTo:'#password' //表示和id="spass"的值相同
                    },
                    saddress:{
                        required:true
                    },
                    sphone:{
                        required:true,
                        phone:true
                    },
                    slike:{
                        required:true,
                    },
                    semail:{
                        required:true,
                        email:true
                    },
                    simage:{
                        required:true,
                        extension:'gif|jpe?g|png'
                    }
                },
                messages:{
                    sname:{
                        required:"请输入用户名",
                        rangelength:$.validator.format("用户名长度为{0}-{1}个字符"),
                        remote:"该用户名已存在！"
                    },
                    spass:{
                        required:"请输入密码",
                        rangelength:$.validator.format("密码长度为{0}-{1}个字符")
                    },
                    spass2:{
                        required:"请再次输入密码",
                        equalTo:"两次密码必须一致" //表示和id="spass"的值相同
                    },
                    sphone:{
                        required:"请输入手机号"
                    },
                    saddress:{
                        required:"请选择地址"
                    },
                    slike:{
                        required:"请选择爱好",
                    },
                    semail:{
                        required:"请填写邮件",
                        email:"邮箱格式不正确"
                    },
                    simage:{
                        required:"请选择要上传的头像",
                        extension:"文件后缀名必须为jpg,jpeg,gif,png"
                    }
                }
            });
             /* 重写错误显示消息方法,以alert方式弹出错误消息 */  
   showErrors : function(errorMap, errorList) {  
    var msg = "";  
    $.each(errorList, function(i, v) {  
     msg += (v.message + "\r\n");  
    });  
    if (msg != "")  
     alert(msg);  
   },  
   /* 失去焦点时不验证 */  
   onfocusout : false  
        });
        第三步：书写html：
         <form action="http://www.hao123.com" method="post" id="ff">
        <fieldset>
            <legend>jQuery-Validate表单校验验证</legend>
            <div class="item">
                <label for="username" class="item-label">用户名:</label>
                <input type="text" id="username" name="sname" class="item-text" placeholder="设置用户名"
                autocomplete="off" tip="请输入用户名">
            </div>
            <div class="item">
                <label for="password" class="item-label">密码:</label>
                <input type="password" id="password" name="spass" class="item-text" 
                placeholder="设置密码" tip="长度为6-16个字符">
            </div>
            <div class="item">
                <label for="password" class="item-label">确认密码:</label>
                <input type="password" name="spass2" class="item-text" placeholder="设置确认密码">
            </div>
            <div class="item">
                <label for="phone" class="item-label">手机号码:</label>
                <input type="text" id="phone" name="sphone" class="item-text" placeholder="输入手机号码" tip="请输入手机号码">
            </div>
            <div class="item">
                <label for="saddress" class="item-label">所在地:</label>
                <select name="saddress" class="item-select">
                    <option value="">---请选择---</option>
                    <option value="北京">北京</option>
                    <option value="上海">上海</option>
                    <option value="深圳">深圳</option>
                </select>
            </div>
            <div class="item">
                <label for="slike" class="item-label">爱好：</label>
                                       上网：<input type="checkbox" name="slike" value="上网"/>
                唱歌：<input type="checkbox" name="slike" value="唱歌"/>
                编程：<input type="checkbox" name="slike" value="编程"/>
                书法：<input type="checkbox" name="slike" value="书法"/><br/>
            </div>
            <div class="item">
                <label for="semail" class="item-label">邮箱:</label>
                <input type="text" id="semail" name="semail" class="item-text" placeholder="设置邮箱" 
                autocomplete="off" tip="请输入邮箱">
            </div>
            <div class="item">
                <label for="simage" class="item-label">头像:</label>
                <input type="file" name="simage" class="item-file">
            </div>
            <div class="item">
                <input type="submit" value="提交" class="item-submit">
            </div>
        </fieldset>
    </form>

第四步：验证的时间，如果需要页面初始化就验证的话就初始化启用，如果在提交的时候启用就在提交的时候验证。
启用的代码如下：

/**启动验证*/
${"#editForm"}.valid();

撤销验证：

//清除验证标签
$(".error").remove();
   //清除验证
  $("#documentForm").validate().resetForm();