jquery验证邮政编码的规则

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 
    } 
}); 

DEMO：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 
    } 
}); 

DEMO：jsfiddle.net/rb3fetuk/1/