Question

我们使用以下代码从单选按钮组中选择一个选项值。如果您在单选按钮控件和水平布局中的选项之间单击（此行为始终可重现），有时单选按钮无法正确选择。如果单击该行的任何位置，如何确保选中该值。

                <h:selectOneRadio value="#{_user.choice}">
                    <f:selectItems value="#{_user.choices}" />
                </h:selectOneRadio>

Answer 1

如果你想使用整个DIV来切换收音机，你需要使用一些JS。如果您只想通过旁边的文本以及收音机和文本标签之间的区域选择收音机，请使用：

<p><label><input type="radio">Click me.</label></p>

你不需要类型的引号，但无论如何最好使用它们。我更喜欢在输入周围使用'p'标签，以便我可以更好地自动纠错。没有必要，你会听到很多人说，“那个p标签是没有必要的。”

您还需要使用'fieldset'标记打开和关闭，也可以使用'legend'标记。您可以在HTML5表格的w3c 4.10上查看规范。

您可能还想使用'value'标记。例如：

<form method="post">
  enctype="application/x-www-form-urlencoded"
  action="https://coke.example.com/order.cgi">
  <p><label>Order number: <input name="orderID"></label></p>
  <fieldset>
    <legend>Drink</legend>
    <p><label><input type="radio" value="coke">Do you want a Coke?</label></p>
    <p><label><input type="radio" value="pepsi">Or do you want a Pepsi?</label></p>
    </legend>
  </fieldset>
</form>

根据我提交的代码，我无法重现您的问题，先生。

Answer 2

<h:selectOneRadio>不会在标签内呈现单选按钮，而单选按钮本身在大多数（如果不是所有）浏览器中都有一些默认边距。点击此边距确实不会选择单选按钮。您希望在CSS的帮助下将此边距设置为零，并在必要时通过填充替换它。 E.g。

<h:selectOneRadion styleClass="radiobuttons">

与

.radiobuttons input { 
    margin: 0;
}

单选按钮无法正确选择

2 个答案: