validate表单验证的用法

正则表达式验证字符串

var value='这是待验证的字符串'
var char=/^[\u4e00-\u9fa5]+$/; //稚嫩恶搞输入汉字
console。log（char.test(value)）

validate表单验证的用法

html部分

<form id="registerPepole" class="container">
                        <%--姓名--%>
                        <div class="reg-menu">
                            <span class="reg-danger">*</span>
                            <label for="name" language="participantsApply.name" >姓名</label>
                            <input type="text" id="name" name="name">
                            <small  id="helpName"></small>
                        </div>
                        <%--英文名--%>
                        <div class="reg-menu">
                            <label language="participantsApply.englishName">英文名</label>
                            <input type="text" id="englishName" name="englishName">
                            <small id="helpEnglish"></small>
                        </div>
                        <%--手机号--%>
                        <div class="reg-menu5">
                            <span class="reg-danger">*</span>
                            <label language="participantsApply.phone">手机号</label>
                            <input type="text" id="phone" name="phone" />
                            <small id="helpPhone"></small>
                        </div>
                        <%--邮箱--%>
                        <div class="reg-menu4">
                            <label language="participantsApply.email">邮箱</label>
                            <input type="text" id="email" name="email" placeholder="邮箱地址可选填">
                            <small></small>
                        </div>
                        <%--证件号--%>
                        <div class="reg-menu7">
                            <span class="reg-danger" >*</span>
                            <label language="participantsApply.Identification Number">证件号码</label>
                            <input type="text" id="idNumber" name="idNumber">
                            <small id="helpID"></small>
                        </div>
                        <%--确认证件号--%>
                            <div class="reg-menu9">
                                <span class="reg-danger" >*</span>
                                <label language="participantsApply.Confirm ID number">确认证件号</label>
                                <input type="text" id="affirmNumber" name="affirmNumber"/>
                                <small id="helpAffirm"></small>
                            </div>
                    </div>
                </div>
                <!-- 注册按钮 -->
                <div class="register">
                    <button  class="btn btn-default btn-lg btn-primary" type="submit" name="registerBtn" id="registerBtn" language="participantsApply.register">注册</button>
                </div>
</form>

jquery部分

$.validator.setDefaults({
    submitHandler: function() {
        alert('表单提交');
});

//自定义验证规则
jQuery.validator.addMethod("zh", function(value, element) {
    var tel = /^[\u4e00-\u9fa5]+$/;
    return this.optional(element) || (tel.test(value));
}, "请输入汉字");
jQuery.validator.addMethod("en", function(value, element) {
    var tel = /^[a-zA-Z \s]{2,20}$/;
    return this.optional(element) || (tel.test(value));
}, "请输入英文");
$.validator.addMethod("isMobile", function(value, element) {
    var length = value.length;
    var mobile = /^(13[0-9]{9})|(18[0-9]{9})|(14[0-9]{9})|(17[0-9]{9})|(15[0-9]{9})$/;
    return this.optional(element) || (length == 11 && mobile.test(value));
}, "请正确填写您的手机号码");
jQuery.validator.addMethod("isCard", function (value, element) {
    var card = $("input[name='idNumber']").val();
    var pattern = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
    return pattern.test(card);
}, "请输入正确的身份证号");
jQuery.validator.addMethod("reIsCard", function (value, element) {
    var card = $("input[name='idNumber']").val();
    var reCard = $("input[name='affirmNumber']").val();
    if (card == reCard) {
        return true
    }else {
        return false
    }
}, "确认证件号");

$().ready(function() {
    $("#registerPepole").validate({
        rules: {
            name: {
                required: true,
                zh:true,
                minlength:2
            },
            englishName:{
                en:true
            },
            phone:{
                required: true,
                isMobile:true
            },
            email:{
                email:true
            },
            idNumber:{
                required: true,
                isCard:true
            },
            address:{
                required: true
            },
            affirmNumber:{
                reIsCard:true
            }
        },
        messages: {
            name: {
                required: "请输入用户名",
                zh:"请输入中文名",
                minlength:"至少2个汉字"
            },
            englishName:{
                en:"请输入2-20个字母"
            },
            phone:{
                required:"请输入手机号",
                isMobile:"请正确输入电话号码"
            },
            email:{
                email:"邮箱格式不正确"
            },
            idNumber:{
                required: "请输入证件号",
                isCard:"证件号格式不正确"
            },
            address:{
                required: "不能为空"
            },
            affirmNumber:{
                reIsCard:"两次输入不一致，请重新输入"
            }
        },
        errorPlacement: function(error, element) {//修改错误信息提示位置,element是验证元素input框等等
            error.appendTo(element.siblings('small'));
        }
    });
});