Jquery form validate返回最后一个元素的错误消息

Question

虽然点击提交，但会显示最后一个元素的错误消息（在这种情况下，“请选择您正在寻找的性别”，并单击表单外的任意位置它返回的第一个元素的错误消息。 我想该错误消息显示第一个无效的元素。 请看附件中的代码。

$(function() { 
    var form = $('.register form'); 
    var checkNameResult = $('#checkname-result'); 
    var validator = form.validate({ 
     errorPlacement: function (error, element) { 
      checkNameResult.empty(); 
      checkNameResult.append(error); 
     } 
    }); 

    $('#Register_UserName').rules("add", { 
     required: true, 
     remote: "/account/IsUsernameAvailable", 
     messages: { 
      required: "Please enter a name", 
      remote: "Name is not available" 
     } 
    }); 
    $("#Register_FirstName").rules("add", { 
     required: true, 
     messages: { 
      required: "Please enter your first name" 
     } 
    }); 
    $("#Register_LastName").rules("add", { 
     required: true, 
     messages: { 
      required: "Please enter your last name" 
     } 
    }); 


    $("#Register_Password").rules("add", { 
     required: true, 
     messages: { 
      required: "Please enter a valid password" 
     } 
    }); 

    $("#Register_Email").rules("add", { 
     required: true, 
     email: true, 
     messages: { 
      required: "Please enter your email address", 
      email: "Please enter a valid email address" 
     } 
    }); 

    $("#Register_Gender_Male").rules("add", { 
     required: true, 
     messages: { 
      required: "Please select your gender" 
     } 
    }); 

    $("#Register_InterestedInMale").rules("add", { 
     required: function (element) { 
      return $('#Register_InterestedInFemale:checked').length == 0; 
     }, 
     messages: { 
      required: "Please select an Interested In gender" 
     } 
    }); 

    $("#Register_InterestedInFemale").rules("add", { 
     required: function (element) { 
      return $('#Register_InterestedInMale:checked').length == 0; 
     }, 
     messages: { 
      required: "Please select a gender you are Looking For" 
     } 
    }); 

    $('#checkname').click(function() { 
     if (validator.element($('#Register_UserName'))) 
      checkNameResult.html("<label class='name-available'>Name is available</label>"); 
     return false; 
    }); 

}); 

Answer 1

嗯，我从来没有尝试验证这样的形式。

使用jquery。验证插件：

$(".selector").validate({ 
    rules: { 
     name: "required", 
     email: { 
      required: true, 
      email: true 
     } 
    }, 
    messages: { 
     name: "Please specify your name", 
     email: { 
      required: "We need your email address to contact you", 
      email: "Your email address must be in the format of name@domain.com" 
     } 
    } 
}); 

我已经用Symfony2，Wordpress，CodeIgniter进行了测试。