Bootstrap 3数据切换按钮-单选钮

Question

看起来在Bootstrap 3中，按钮单选框不再起作用。

<div class="btn-group" data-toggle="buttons-radio">
    <button class="btn btn-default" value="1" type="button" >1</button>
    <button class="btn btn-default" "value="2" type="button" >2</button>
</div>

现在已经用单选按钮替代了它。有没有办法在组中只允许勾选一个按钮？我需要在选择一个项目后能够完全取消组的选择，因此单选按钮不能满足我的需求。

以下是对我来说使用类似于BS3中按钮类型的解决方案：

$(this).addClass("current").siblings().removeClass("active");

- Rich P

Answer 1

这对我来说最终是解决在BS3中使用单选按钮的答案：

$(this).addClass("current").siblings().removeClass("active");

- Rich P

---

我使用了这个代码，但将 addClass("current") 替换为 addClass("active")。 - Robert Tupelo-Schneck

是的，看起来我们必须使用 $(this).addClass("active").siblings().removeClass("active");。 - Jon Onstott

使用addClass("current")将按钮突出显示为active，直到您点击其他区域，然后两者都不会再突出显示为active。使用addClass("active")会是更好的解决方案。 - olimortimer

Answer 2

您能将所有的收音机设置为相同的 name= 吗？这样它们就可以互相切换了。

<label class="radio-inline">
  <input type="radio" name="radioGroup" id="radio1" value="option1"> 1
</label>
<label class="radio-inline">
  <input type="radio" name="radioGroup" id="radio2" value="option2"> 2
</label>
<label class="radio-inline">
  <input type="radio" name="radioGroup" id="radio3" value="option3"> 3
</label>

演示: http://bootply.com/75922

- Zim

---

问题在于我需要能够取消所有的选择。我想我可以更新所有内容以使用单选按钮并使用 http://jsfiddle.net/briguy37/EtNXP/ ，但我真的希望有一种方法来保持这些为 <buttons> 而不是使用 <input type="radio">。 - Rich P

Answer 3

添加

 data-toggle="button"

对于每个单选按钮

来源 http://labs.thecssninja.com/bootleg/index.html#buttons

- Jaider

Answer 4

在选项卡中添加input type="radio：

<a href="#prices" class="btn btn-default active" data-toggle="tab">
    <input type="radio">Prices
</a>

- Davide