HTML5验证复选框组

Question

我＆lt; 3在浏览器中进行验证，而不是使用特定的框架。使用element.setCustomValidity可以更改工具提示中显示的消息。它适用于每个元素，但我不知道如何处理复选框组。

假设您有三个复选框，您必须选择2.所需的结果是让工具提示环绕该组，指示用户在继续之前选择2。

html5如何允许这个？这就是我一直害怕的，非常典型的用例，以及如何使它与其他验证行为协同工作，这非常棒（首先关注无效字段，工具提示，输入按键提交）。

思想？

这是一个片段示例。

<form>
Choose your favorite two stooges.
<label>Moe</label><input type="checkbox" name="stooges">
<label>Larry</label><input type="checkbox" name="stooges">
<label>Curley</label><input type="checkbox" name="stooges">
<label>Yes, I have agreed to this</label><input required name="ack">
<button>Submit</button>
</form>

Answer 1

我会运行一个迭代所有复选框的函数，如果选中了2个复选框，则只返回true。

因此，工具提示可以在开头显示2，然后是1，如果没有连续需要的复选框，则可以将复选框呈现为绿色，或者如果用户尝试继续而没有2个复选框，则可以将框呈现为红色