Question

我有这段代码：

<form name="quiz" ng-submit="quiz.answer(selected)">
  <label>
    <input type="radio" ng-model="selected" ng-value="true"> Red
  </label>
  <br/>
  <label>
    <input type="radio" ng-model="selected" ng-value="false"> Green
  </label>
  <br/>
  <label>
    <input type="radio" ng-model="selected" ng-value="false"> Blue
  </label>
  <br/>
  <label>
    <input type="radio" ng-model="selected" ng-value="false"> Yellow
  </label>
  <br/>
  <input type="submit" id="submit" value="Submit" />
</form>

如果单击一个，如何防止立即选择所有错误值？

Answer 1

<form name="quiz" ng-submit="quiz.answer(selected)">
  <label>
    <input type="radio" ng-model="selected" ng-value="red">
    Red
  </label><br/>
  <label>
    <input type="radio" ng-model="selected" ng-value="green">
    Green
  </label><br/>
  <label>
    <input type="radio" ng-model="selected" ng-value="blue">
    Blue
  </label><br/>
  <label>
    <input type="radio" ng-model="selected" ng-value="yellow">
    Yellow
  </label><br/>
  <input type="submit" id="submit" value="Submit" />
</form>

为每个单选按钮指定一个不同的值。

Answer 2

根据我的理解，您希望对单选按钮进行分组，以便通过在每个单选按钮中添加名称属性来一次选择一个单选按钮，并为所有单选按钮指定相同的名称。因此，在提交时，您可以在提交函数调用中获取所选变量的值。

   <form name="quiz" ng-submit="quiz.answer(selected)">
         <label>
    <input type="radio" name="quizOption" ng-model="selected" ng-value="true">
    Red
  </label><br/>
  <label>
    <input type="radio" name="quizOption" ng-model="selected" ng-value="false">
    Green
  </label><br/>
  <label>
    <input type="radio" name="quizOption" ng-model="selected" ng-value="false">
    Blue
  </label><br/>
  <label>
    <input type="radio" name="quizOption" ng-model="selected" ng-value="false">
    Yellow
  </label><br/>
  <input type="submit" id="submit" value="Submit" />
</form>

如何防止单选按钮中的多个选择？

2 个答案: