jQuery Validate驗證方法及教程

//實名認證 驗證
$(function(){
    
    //中文姓名驗證
    jQuery.validator.addMethod("zh_verify", function(value, element) {
    var tel = /^[\u4E00-\u9FA5\uf900-\ufa2d]{2,10}$/;
    return this.optional(element) || (tel.test(value));    
    }, "請輸入2~10個字的中文！");
    
    //身份證號驗證
    jQuery.validator.addMethod("idcard_verify", function(value, element) {
    var idcard = /^(\d{15}$|^\d{18}$|^\d{17}(\d|X|x))$/;
    return this.optional(element) || (idcard.test(value));
    }, "請輸入正確格式的身份證號！");
    
    //jquery.validate插件驗證
    $("#nameauth").validate({
        errorElement: 'div',
        errorClass: 'help-block',
        focusInvalid: false,
        ignore: "",
        rules: {
            tname: {
                required: true,
                zh_verify:true
            },
            idcard: {
                required: true,
                idcard_verify:true
            },
            con_idcard: {
                required: true,
                equalTo: '.idcard'
            }
        },
        messages: {
            tname: {
                required: "真實姓名不能為空！",
                rangelength: "請輸入2~18個中文！"
            },
            idcard: {
                required: "身份證不能為空！",
                rangelength: "請輸入15~18個字符的身份證！"
            },
            con_idcard: {
                required: "確認證號不能為空！",
                equalTo: '確認證號與身份證號不一致！'
            }
        },
        errorLabelContainer: "#resultMsg",
        submitHandler:function() {
            //$(form).ajaxSubmit();    //同步提交FORM
            var tname = $('input[name=tname]').val();
            var idcard = $('input[name=idcard]').val();
            var resultMsg = $('#resultMsg');
            ajaxSubmitForm(tname, idcard, resultMsg);            
        }
    });
})

//異步執行方法
function ajaxSubmitForm(tname, idcard, resultMsg) {
    $.ajax({
        url: "/member/nameauth",
        data: "tname=" + tname + "&idcard=" + idcard + "&con_idcard=" + idcard,
        type: "post",
        cache: false,
        dataType: "json",
        success: function(data, textStatus){
            if(data.return){
                window.location.reload();    
            }else{
                resultMsg.css({'color': 'red'}).html(data.errmsg).show().delay(2000).hide(0);
            }
        }
    });
}

或者

$(function(){
    //jquery.validate插件自定義AJAX驗證（驗證賬戶是否存在）
    $.validator.addMethod("checkUserExist",function(value,element){
        var user = value;
        $.ajax({
            type:"POST",
            async:true, 
            dataType:'json',
            url:"/account/verifyAccount",
            data:"param=" + $('input[name=newpassword]').val(),
            success:function(response){
                if(response){
                    res = response.state;
                }
            }
        });
        return res;
    },"賬號不存在，請仔細檢查！");
    
    //jquery.validate插件驗證
    $("#signupForm").validate({
        rules: {
            newpassword: {
                required: true,
                rangelength:[6,30]
            }
        },
        messages: {
            newpassword: {
                required: "請輸入6~30個字符的交易密碼！",
                rangelength: "請輸入6~30個字符的交易密碼！"
            }
        },
        submitHandler:function(form) {
            $(form).ajaxSubmit();
        }
    });
})

 

jQuery Validate教程

http://www.w3cschool.cc/jquery/jquery-plugin-validate.html