一个窗体中的多个单选按钮组

是否有可能在一个表单中有多个单选按钮组?通常选择一个按钮取消选择前一个,我只需要有一个组取消选择。

<form>
<fieldset id="group1">
<input type="radio" value="">
<input type="radio" value="">
</fieldset>


<fieldset id="group2">
<input type="radio" value="">
<input type="radio" value="">
<input type="radio" value="">
</fieldset>
</form>
407522 次浏览

设置相同的 name属性来创建一个组;

<form>
<fieldset id="group1">
<input type="radio" value="value1" name="group1">
<input type="radio" value="value2" name="group1">
</fieldset>


<fieldset id="group2">
<input type="radio" value="value1" name="group2">
<input type="radio" value="value2" name="group2">
<input type="radio" value="value3" name="group2">
</fieldset>
</form>

就做一件事, 我们需要为相同的类型设置 name 属性。

试试以下方法:

<form>
<div id="group1">
<input type="radio" value="val1" name="group1">
<input type="radio" value="val2" name="group1">
</div>
</form>

还有 我们也可以用 angular1,anger2或者 jquery 来做。

<div *ngFor="let option of question.options; index as j">
<input type="radio" name="option\{\{j}}" value="option\{\{j}}" (click)="checkAnswer(j+1)">\{\{option}}
</div>

要创建一组输入,您可以创建一个自定义 html 元素

window.customElements.define('radio-group', RadioGroup);

Https://gist.github.com/robdodson/85deb2f821f9beb2ed1ce049f6a6ed47

为了在每个组中保留选中的选项,需要向组中的输入添加 name 属性,如果不添加,则所有属性都是一个组。

这非常简单,您需要保留每个无线电输入组的不同名称。

      <input type="radio" name="price">Thousand<br>
<input type="radio" name="price">Lakh<br>
<input type="radio" name="price">Crore
      

</br><hr>


<input type="radio" name="gender">Male<br>
<input type="radio" name="gender">Female<br>
<input type="radio" name="gender">Other

在输入字段使名称相同 喜欢

<input type="radio" name="option" value="option1">
<input type="radio" name="option" value="option2" >
<input type="radio" name="option" value="option3" >
<input type="radio" name="option" value="option3" >