Question

在表单提交时，您如何根据需要标记复选框/单选按钮？

Answer 1

必需的复选框并不罕见。实际上，每个注册表都使用某种形式的“我已阅读并接受用户协议”复选框。

如果您有Opera方便，请尝试下面的代码。除非选中该复选框，否则表单将不会提交。

<!doctype html>
<html>

<head>
  <title>html5</title>
</head>

<body>
  <h1>html5 test</h1>
  <form action="/">
    <input type="checkbox" required="required" id="cb" name="cb">
    <label for="cb">required checkbox</label>
    <input type="submit">
  </form>
</body>

</html>

Answer 2

对于复选框，最好的方法可能是预先选择它并将其设置为禁用。开个玩笑。

要确保选择组中的一个单选按钮，请使用默认选项启动或使用javascript验证。没有HTML方法可以做到这一点，因为每个可能的选择都是有效的。

在html5中，复选框有required属性。

它们有点奇怪，所以让我引用一些东西来解释它们是如何工作的。

对于复选框，只有在选中该表单中包含该名称的一个或多个复选框时，才能满足必需属性。

对于单选按钮，只有在检查该无线电组中的一个单选按钮时，才能满足所需属性。

当然，您总是需要验证服务器端，因为客户端总能向您发送他想要的任何内容。只需使用这些方法即可获得更好的用户体验。

Answer 3

我今天在XP SP2上的Firefox 17.0.1上测试了Radio Buttons的必需属性。

它似乎符合单选按钮/组的 required 属性的规范。当Firefox提示“请选择其中一个选项”时。对于以下两个代码段：

您可以为每个单选按钮设置 required 属性

<input type="radio" name="gender" value="male" required="required" />
<input type="radio" name="gender" value="female" required="required" />

或任何一个无线电元素

<input type="radio" name="color" value="blue" />
<input type="radio" name="color" value="red" required="required" />
<input type="radio" name="color" value="green" />

欢迎任何评论和更新。

Answer 4

我刚刚在Firefox 4的单选按钮上尝试了它。将required添加到一个无线电输入，然后在选择一个之前提交，触发“请选择其中一个选项”工具提示。

E.g。这有效：

<input type="radio" name="gender" value="m" required />
<input type="radio" name="gender" value="f" />

html5：复选框/无线电中所需属性的重要性

4 个答案: