jquery postal/zip 代码的验证规则

Question

我得到了以下部分有效的代码。如果国家是加拿大 pay_id_1 == 1，我需要验证加拿大邮政；如果 pay_id_1 == 234.

，我需要验证美国邮政编码

var validator = $form.validate({
    ignore: ".ignore,:hidden:not(input[type='hidden'])",
    rules: {
        par_prenom_1: {
            required: true
        },
        par_nom_1: {
            required: true
        },
        par_adresse_1: {
            required: true
        },
        par_ville_1: {
            required: true
        },
        pro_id_1: {
            required: true
        },
        pay_id_1: {
            required: true
        },
        par_codepostal_1: {
            required: true,
            postalCodeCA: function() {
                if ($("#pay_id_1").val() === 1) {
                    return true
                } else {
                    return false
                }
            },
            zipcodeUS: function() {
                if ($("#pay_id_1").val() === 234) {
                    return true
                } else {
                    return false
                }
            }
        },
        par_telephone1_1: {
            required: true
        },
        par_courriel_1: {
            required: true,
            email: true
        },
        par_naissance_1: {
            required: true,
            dateCA: true,
            daterange: ["1917-09-04", "2001-09-03"]
        },
        par_sexe_1: {
            required: true
        },
        que_2580_1: {
            required: true
        },
        que_2581_1: {
            required: true
        },
        que_2582_1: {
            required: true
        },
        que_2583_1: {
            required: true
        }
    },
    messages: {
        par_prenom_1: {
            required: "Veuillez entrer une valeur"
        },
        par_nom_1: {
            required: "Veuillez entrer une valeur"
        },
        par_adresse_1: {
            required: "Veuillez entrer une valeur"
        },
        par_ville_1: {
            required: "Veuillez entrer une valeur"
        },
        pro_id_1: {
            required: "Veuillez entrer une valeur"
        },
        pay_id_1: {
            required: "Veuillez entrer une valeur"
        },
        par_codepostal_1: {
            required: "Veuillez entrer le code postal/zip",
            postalCodeCA: "Veuillez entrer un code postal/zip valide"
        },
        par_telephone1_1: {
            required: "Veuillez entrer le numéro de téléphone",
            phoneUS: "Le numéro de téléphone doit être sous le format 555-555-5555"
        },
        par_courriel_1: {
            required: "Veuillez entrer le courriel",
            email: "Le courriel doit être une adresse valide"
        },
        par_naissance_1: {
            required: "Veuillez entrer la date de naissance",
            dateCA: "La date de naissance doit être sous le format AAAA-MM-JJ",
            daterange: "La date de naissance doit être entre {0} et {1}"
        },
        par_sexe_1: {
            required: "Veuillez entrer une valeur"
        },
        que_2580_1: {
            required: "Veuillez faire un choix"
        },
        que_2581_1: {
            required: "Veuillez entrer une valeur"
        },
        que_2582_1: {
            required: "Veuillez entrer une valeur"
        },
        que_2583_1: {
            required: "Veuillez entrer une valeur"
        }
    }
});

问题是这两条规则都适用于任何国家。你能看到我看不到的东西吗？

Answer 1

您需要利用 .rules() 方法来动态更改字段上的规则。

您可以使用 click 和 focus 事件触发函数。在 .validate() 方法中使用 rules 对象来设置任何初始默认规则。

此外，如其他答案所述，您需要使用引号，因为该字段的值是一个字符串。

$('[name="par_codepostal_1"]').on('click focus', function() {
    if ($("#pay_id_1").val() === '1') {
        $(this).rules('add', {
            postalCodeCA: true,
            zipcodeUS: false
        });
    } else if ($("#pay_id_1").val() === '234') {
        $(this).rules('add', {
            postalCodeCA: false,
            zipcodeUS: true
        });
    } else {
        // whatever
    }
});

演示：jsfiddle.net/rb3fetuk/

或者，当您 blur 离开 pay_id_1 字段时，您可以触发规则更改。

$('#pay_id_1').on('blur', function() {
    if ($(this).val() === '1') {
        $('[name="par_codepostal_1"]').rules('add', {
            postalCodeCA: true,
            zipcodeUS: false
        });
    } else if ($(this).val() === '234') {
        $('[name="par_codepostal_1"]').rules('add', {
            postalCodeCA: false,
            zipcodeUS: true
        });
    } else {
        // whatever
    }
});

演示：jsfiddle.net/rb3fetuk/1/

jquery postal/zip 代码的验证规则

jquery validation rules for postal/zip code

jquery

jquery-validate