Jquery验证未应用于字段

Question

我有一个预先存在的表单，我试图将jquery验证添加到包含：

         <p><span class="style9">City </span>
                        <input type="text" name="city" value="" size="20" class="style7"><span class="style9">
                        State </span>
                        <input type="text" name="state" value="" size="20" class="style7"><span class="style9">
                        Zip </span>
                        <input type="text" name="zip" value="" size="20" class="style7"><span class="style9">
                        Zip </span>
                        </p>

使用jquery验证器插件，我添加了：

$('form').validate({
    rules: {
        first_name: {
            minlen: 3,
            maxlength: 15,
            required: true
        },
        last_name: {
            minlength: 3,
            maxlength: 15,
            required: true
        },
        email: {
          required: true,
          email: true
        },
         phone1: {
             required: true,
             phoneUS: true
          },
        phone2: {
             required: true,
             phoneUS: true
          },
            street: {
            required: true
          },
              city: {
            required: true
          },
              state: {
            required: true
          },
              zip: {
            zipcodeUS: true
          }

    },
    highlight: function(element) {
        $(element).closest('.style9').addClass('.style13');
        //$(element).addClass('.style13');
    },
    unhighlight: function(element) {
        $(element).closest('.style9').removeClass('.style13');
        //$(element).removeClass('.style13');
    },
    errorElement: 'span',
    errorClass: 'style13',
    errorPlacement: function(error, element) {
        if(element.parent('.input-group').length) {
            error.insertAfter(element.parent());
        } else {
            error.insertAfter(element);
        }
    }
});

正如您在屏幕截图中看到的，前两个字段可以应用验证，但不是最后一个。我做错了什么？

Answer 1

制作字段＆＃34; required＆＃34;如果它空了，你必须使用required规则......

zip: {
   required: true,  // <- prevent it from being left empty
   zipcodeUS: true
}

DEMO：http://jsfiddle.net/rr8u9a46/

---

---

如your other question所述，您在minlength字段上的first_name规则拼写错误。

$('form').validate({
    rules: {
        first_name: {
            minlen: 3,  // <-- minlength
            maxlength: 15,
            required: true
        },
        .....

---

注意：要使用zipcodeUS方法，必须包含the additional-methods.js file，其中包含此规则。