jquery验证插件错误放置

Question

我正在使用Jquery Validation Plugin。这是我的问题 - 我有一个简单的形式，就像这样

<form id="form">
   <label>Name</label>
       <input type="text" name="name" id="name" class="required" minlength="2">
   <span></span>
   <label>Surname</label>
       <input type="text" name="surname" id="surname" class="required" minlength="2>
   <span></span>
   <input type="submit" value="submit">
</form>

验证脚本是这样定制的 -

$(function(){
$("#form").validate({
    messages: {
        name: "Please enter name.",
        surname: "Please enter surname."    
    },
    errorElement: "span",   
    errorPlacement: function(error, element) {
            error.insertAfter(element);
        }   
});
});

问题是，错误消息都显示在第一个span标记中。我怎么能纠正这个。有关如何解决这个问题的任何建议吗？

谢谢！

Answer 1

更新html以使用

标签

<label for="name">

尝试 - http://jsfiddle.net/EUWEE/1/