只需选择一个单选按钮即可

时间:2018-02-21 19:53:42

标签: html css twitter-bootstrap radio-button

我使用bootstrap单选按钮,我不希望用户可以选择多个单选按钮。但它不起作用,用户可以选择所有的单选按钮。

你知道为什么吗?



div class="form-row">
<div class="form-group col col-lg-6">
  <label for="rtypes" class="">Rtypes</label>

  <div class="form-check">
    <input class="form-check-input" type="radio" name="radiobutton1" id="" value="option1" checked>
    <label class="form-check-label" for="radiobutton1">
                                RadioButton1
                            </label>
  </div>

  <div class="form-check">
    <input class="form-check-input" type="radio" name="radiobutton2" id="radiobutton2" value="option2">
    <label class="form-check-label" for="exampleRadios2">
                                RadioButton2
                            </label>
  </div>

</div>
</div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:2)

单选按钮属性name必须相同,因此用户只能选择一个具有相同名称的属性。这样您就可以拥有多个组。

&#13;
&#13;
div class="form-row">
                <div class="form-group col col-lg-6">
                    <label for="rtypes" class="">Rtypes</label>

                    <div class="form-check">
                        <input class="form-check-input" type="radio" name="radiobutton" id="" value="option1" checked>
                        <label class="form-check-label" for="radiobutton1">
                            RadioButton1
                        </label>
                    </div>

                    <div class="form-check">
                        <input class="form-check-input" type="radio" name="radiobutton" id="radiobutton2"
                               value="option2">
                        <label class="form-check-label" for="exampleRadios2">
                            RadioButton2
                        </label>
                    </div>

                </div>
            </div>
&#13;
&#13;
&#13;