Jquery 验证错误放置（单选按钮）

我正在尝试使用 Jquery 验证插件来验证我的表单。我的大多数输入元素的右侧都会出现错误消息，但单选按钮只会给我带来麻烦。

如果我没有给出 div.group 类的宽度，错误消息会出现在整个页面的外部（因为我假设 div 宽度是页面的 100%？）不执行任何操作会导致出现错误消息在第一个单选按钮而不是第二个单选按钮之后。我无法对宽度进行硬编码，因为我想在多个宽度的单选组上使用它。我怎样才能让它出现在单选按钮中单选按钮结束处的右边缘？

Thanks!

var validator = $("#myForm").validate({
        errorElement: "div",
        wrapper: "div",  // a wrapper around the error message
        errorPlacement: function(error, element) {

            if (element.parent().hasClass('group')){
                element = element.parent();
            }


            offset = element.offset();
            error.insertBefore(element)
            error.addClass('message');  // add a class to the wrapper
            error.css('position', 'absolute');
            error.css('left', offset.left + element.outerWidth());
            error.css('top', offset.top);
    }
});

And then

<p>
    <div class="group">
        <label>Gender</label>
        Male: <input id="gender_male" type="radio" name="gender" class="required" value="Male" />
        Female: <input id="gender_female" type="radio" name="gender" class="required" value="Female"  />
    </div>

也许只是一种让错误消息出现在组中最后一个单选按钮之后的方法？如果我可以获得最后一个元素的句柄，我可以相应地更改偏移量。

编辑：啊哈，我刚刚使用了 div.group{display:inline-block;}。

您还可以使用此方法在任意位置为特定字段放置错误。

errorPlacement: function(error, element) {
  if (element.attr("name") == "PhoneFirst" || element.attr("name") == "PhoneMiddle" || element.attr("name") == "PhoneLast") {
     error.insertAfter("#requestorPhoneLast");
  } else {
     error.insertAfter(element);
  }
},