复选框验证组的HTML问题



我在验证我的复选框组时遇到了一个问题。

我的代码如下:

<script>
$('div.checkbox-group.required :checkbox:checked').length > 0
</script>
<figure class="fig">
<label>
<div class="order">19</div>
<p>MDU Floor Layout<span class="asterisk">&#42;</span></p>
</label>
<br>
<fieldset id="opfloorlayout" class="checkbox-group required" required>
<div>
<input type="checkbox" id="opbasement" name="mdu_floor_layout" value="Basement">
<label class="checking" for="opbasement">Basement</label>
</div>
<div>
<input type="checkbox" id="opcarpark" name="mdu_floor_layout" value="Underground car park">
<label class="checking" for="opcarpark">Underground Car Park</label>
</div>
<div>
<input type="checkbox" id="opintake" name="mdu_floor_layout" value="Intake cupboard">
<label class="checking" for="opintake">Intake Cupboard</label>
</div>
<div>
<input type="checkbox" id="opriser" name="mdu_floor_layout" value="Riser cupboards">
<label class="checking" for="opriser">Riser Cupboards</label>
</div>
<div>
<input type="checkbox" id="opfceiling" name="mdu_floor_layout" value="False Ceiling">
<label class="checking" for="opfceiling">False Ceiling</label>
</div>
<div>
<input type="checkbox" id="opnothing" name="mdu_floor_layout" value="No riser or intake cupboard">
<label class="checking" for="opnothing">No Riser or Intake Cupboard</label>
</div>
</fieldset>
<br>
</figure>

我主要尝试了这个最适合我的解决方案:

使用HTML5";"必需";一组复选框的属性?

但我不知道为什么我的浏览器无法识别验证?

我在这里做错了什么?

您是:

  • 测试在复选框存在之前检查了多少复选框(这也是在用户有机会检查其中任何复选框之前(
  • 你没有对那次测试的结果采取任何行动

通常这种测试的逻辑是:

当用户尝试提交表单时请确保至少选中一个复选框,如果没有,请取消提交表单并显示一条消息,告诉用户问题所在

您跳过了粗体部分。

最新更新