19

经过无数小时的研究,我仍然对如何让 Checked 属性为 Bootstrap 的按钮单选组工作感到目瞪口呆。我正在尝试默认“优秀”。

即使我确定无线电输入是否checked存在selected,我什至尝试过selected但没有任何效果。

<div class="btn-group" data-toggle="buttons">
    <label class="btn btn-default">
        <input type="radio" name="inputWalls" id="inputWalls" value="Excellent" checked>
    Excellent </label>
    <label class="btn btn-default">
        <input type="radio" name="inputWalls" id="inputWalls" value="Good">
    Good </label>
    <label class="btn btn-default">
        <input type="radio" name="inputWalls" id="inputWalls" value="Poor">
    Poor </label>
</div>

如果需要澄清,请告诉我。

4

3 回答 3

26

在 twitter 引导程序中,您将使用“活动”类指示默认值。因此,对于您的示例,如果您使用 Twitter Bootstrap,以下代码将使用“优秀”作为默认检查。

<div class="btn-group" data-toggle="buttons">
    <label class="btn btn-default **active**">
        <input type="radio" name="inputWalls" id="inputWalls" value="Excellent" checked>
    Excellent </label>
    <label class="btn btn-default">
        <input type="radio" name="inputWalls" id="inputWalls" value="Good">
    Good </label>
    <label class="btn btn-default">
        <input type="radio" name="inputWalls" id="inputWalls" value="Poor">
    Poor </label>
</div>

当您切换按钮时,您可以从标签的类中添加/删除类 - “活动”。

例如,检查一下 - http://getbootstrap.com/javascript/#buttons - Radio

于 2013-08-20T22:53:11.163 回答
0

看起来问题和答案正在使用引导程序 3.0。我有同样的问题,但使用 bootstrap 2.3。

<div class="btn-group" data-toggle="buttons-radio">
    <button class="btn active"> Option 1</button>
    <button class="btn"> Option 2</button>
    <button class="btn"> Option 3</button>
</div>
于 2014-01-16T19:55:23.693 回答
-2

两件事情:

  1. 您应该为每个<input>元素使用不同的 ID——它们应该是唯一的!
  2. 你的例子对我有用!在JSFiddle上查看!
于 2013-08-20T03:04:28.977 回答