简体   繁体   English

如何防止单选按钮中的多重选择?

[英]How to prevent multiple select in radio button?

I've this code: 我有以下代码:

<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>

How do I prevent ALL of the false values from being selected at once if I click one? 如果单击一个,如何防止一次选择所有错误值?

<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>

Give each of the radio buttons a distinct value. 给每个单选按钮一个不同的值。

As per my understanding you want to group the radio buttons such that one is selected at a time you can do it by adding name attribute in each radio button and give same name to all of them. 根据我的理解,您希望对单选按钮进行分组,以便一次选中一个单选按钮,您可以通过在每个单选按钮中添加名称属性并为所有单选按钮赋予相同的名称来进行选择。 So at time of submit you can get the value of selected variable in submit function call. 因此,在提交时,您可以在提交函数调用中获取所选变量的值。

   <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>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM