引导按钮单选组默认值（检查属性）不起作用

Question

经过无数小时的研究，我仍然对如何让 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>

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

Answer 1

在 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

Answer 2

看起来问题和答案正在使用引导程序 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>

Answer 3

两件事：

1. 您应该为每个 <input> 元素使用不同的 ID——它们应该是唯一的！
2. 您的示例对我有用！查看JSFiddle！