我的表单中有两个用于性别选择的单选按钮。
我正在使用this用于验证的插件。 当我对单选按钮应用验证时，该插件将错误标签放置在两个单选按钮之间。
这是 fiddle :http://jsfiddle.net/wyFQp/1/
HTML:
<head>
<body>
<form id='registration_form'>
<input type="radio" value="M" name="gender" class="gender" id="genderm"
/>Male
<input type="radio" value="F" name="gender" class="gender ml_10" id="genderf"
/>Female
<input type='submit' />
</form>
</body>
如何将错误标签放置在两个单选按钮之后？或者至少在一些像样的地方？
最佳答案
在您希望显示错误的标记中添加错误标签:
<label class="error" generated="true" for="gender" style="display:none;"></label>
将其与 radio 输入关联时，错误标签的 for 属性对应于 radio 的 name - 这方便了操作，因为具有相同名称的 radio 将仅选择一个 radio 一次和一个与该组关联的错误标签。
但对于文本输入(以及 select/textarea/type="checkbox")，必须使用 id .
另一种不太黑客的方法是使用 errorPlacement带有错误容器的选项，例如:
<div id="genderErrorContainer"></div>
$("#registration_form").validate({
rules: {[...]},
messages: {[...]},
submitHandler: fn,
errorPlacement: function(error, element) {
if (element.prop('name') === 'gender') {
error.appendTo('#genderErrorContainer');
}
}
});
当然，你也可以使用其他 DOM 操作方法将错误元素添加到 DOM 中，例如 .append、.prepend、.after 、insertAfter、.before、.insertBefore结合基于原点element的DOM遍历验证错误，根据您的 HTML 结构，可能不需要额外的标记。
关于单选按钮上的 jQuery 验证，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/14467798/