Javascript JQuery验证消息奇怪地出现在两个单选按钮之间
我正在使用JQuery验证插件来验证我的表单。除单选按钮外，所有字段的验证消息均正确显示在相应字段下方。但对于单选按钮，消息显示在前两个单选按钮之间Javascript JQuery验证消息奇怪地出现在两个单选按钮之间,javascript,jquery,html,validation,radio-button,Javascript,Jquery,Html,Validation,Radio Button,我正在使用JQuery验证插件来验证我的表单。除单选按钮外，所有字段的验证消息均正确显示在相应字段下方。但对于单选按钮，消息显示在前两个单选按钮之间 gender : { required : true } <html:radio property="gender" value="1" name="formBean" styleId="gender"> Male </html:radio> &
gender : {
required : true
}
<html:radio property="gender" value="1"
name="formBean" styleId="gender"> Male </html:radio>
<html:radio property="gender" value="0"
name="formBean" styleId="gender"> Female </html:radio>
性别：{
必填项：true
}
男性
女性
<html>
<body>
<style>
.errorMsq {
color: red;
}
</style>
<form>
<div>
<input type="radio" name="gender" value="male">male
<input type="radio" name="gender" value="female">female
</div>
<br>
<button type="button">check</button>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.13.1/jquery.validate.min.js"></script>
<script>
$('form').validate({
rules: {
gender: {required: true},
},
errorPlacement: function(label, element) {
label.addClass('errorMsq');
element.parent().append(label);
},
});
$('button').click(function () {
$('form').valid();
});
</script>
</body>
</html>
.errorMsq{
颜色：红色；
}
男性的
女性的
检查
$（'form'）。请验证({
规则：{
性别：{required:true}，
},
errorPlacement:函数（标签、元素）{
label.addClass（'errorMsq'）；
element.parent（）.append（标签）；
},
});
$（“按钮”）。单击（函数（）{
$（'form'）.valid（）；
});
能否提供呈现的HTML而不是服务器端标记？你能在JSFIDLE上复制这个问题吗？你能做的最简单的方法是将CSS应用于警报消息，目标指向这些无线电设备。你有没有试过在错误消息中使用标签标签？渲染后它应该如下所示：