jquery.validate使用攻略

一些常用的驗證腳本

不會寫js了,只能從網上找一些常用的驗證腳本。

// 手機號碼驗證
jQuery.validator.addMethod("mobile", function(value, element) {
    var length = value.length;
    var mobile =  /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/
    return this.optional(element) || (length == 11 && mobile.test(value));
}, "手機號碼格式錯誤");   

// 電話號碼驗證   
jQuery.validator.addMethod("phone", function(value, element) {
    var tel = /^(0[0-9]{2,3}\-)?([2-9][0-9]{6,7})+(\-[0-9]{1,4})?$/;
    return this.optional(element) || (tel.test(value));
}, "電話號碼格式錯誤");

// 郵政編碼驗證   
jQuery.validator.addMethod("zipCode", function(value, element) {
    var tel = /^[0-9]{6}$/;
    return this.optional(element) || (tel.test(value));
}, "郵政編碼格式錯誤");

// QQ號碼驗證   
jQuery.validator.addMethod("qq", function(value, element) {
    var tel = /^[1-9]\d{4,9}$/;
    return this.optional(element) || (tel.test(value));
}, "qq號碼格式錯誤");

// IP地址驗證
jQuery.validator.addMethod("ip", function(value, element) {
    var ip = /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
    return this.optional(element) || (ip.test(value) && (RegExp.$1 < 256 && RegExp.$2 < 256 && RegExp.$3 < 256 && RegExp.$4 < 256));
}, "Ip地址格式錯誤");

// 字母和數字的驗證
jQuery.validator.addMethod("chrnum", function(value, element) {
    var chrnum = /^([a-zA-Z0-9]+)$/;
    return this.optional(element) || (chrnum.test(value));
}, "只能輸入數字和字母(字符A-Z, a-z, 0-9)");

// 中文的驗證
jQuery.validator.addMethod("chinese", function(value, element) {
    var chinese = /^[\u4e00-\u9fa5]+$/;
    return this.optional(element) || (chinese.test(value));
}, "只能輸入中文");

// 下拉框驗證
$.validator.addMethod("selectNone", function(value, element) {
    return value == "請選擇";
}, "必須選擇一項");

// 字節長度驗證
jQuery.validator.addMethod("byteRangeLength", function(value, element, param) {
    var length = value.length;
    for (var i = 0; i < value.length; i++) {
        if (value.charCodeAt(i) > 127) {
            length++;
        }
    }
    return this.optional(element) || (length >= param[0] && length <= param[1]);
}, $.validator.format("請確保輸入的值在{0}-{1}個字節之間(一箇中文字算2個字節)"));

使用:
      jQuery.validator.addMethod("isphone", function (value, element) {
            var length = value.length;
            var mobile = /^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;
            var tel = /^(0[0-9]{2,3}\-)?([2-9][0-9]{6,7})+(\-[0-9]{1,4})?$/;
            return this.optional(element) || (tel.test(value) || mobile.test(value));
        }, "電話號碼格式錯誤");
        $("#address-form").validate({
            rules: {
                adrAddress: {
                    required: true
                },
                adrName: {
                    required: true
                },
                adrPhone: {
                    required: true,
                    isphone: true
                }
            },
            messages: {
                adrAddress: {
                    required: "該項不能爲空"
                },
                adrName: {
                    required: "該項不能爲空"
                },
                adrPhone: {
                    required: "該項不能爲空",
                    isphone: "電話號碼格式錯誤"
                }
            }
        });
發佈了2 篇原創文章 · 獲贊 2 · 訪問量 2萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章