Twitter bootstrap 多行引导（单选）按钮组

我有一个按钮组，其中有几个项目必须作为单选按钮。我还需要将它们分成几行，并跨越容器的整个宽度

为此，我使用了bootstrap的类

btn-group-justified

，并将

元素分成几个按钮组，同时保持相同的名称

这看起来还可以，但有一个副作用，即按钮不会切换其他组中的选中元素，即使它们具有相同的

名称

。也就是说，它们不再作为同一组中的单选按钮

Jsfiddle.如您所见，如果您在第一行选择一个按钮，然后在第二行单击一个按钮，则第一个元素不会被关闭

---

有没有一种方法可以获得一个多行按钮组，而不必使用javascript对广播行为进行黑客攻击

而不是对两组进行此操作

只需将其放在顶部，但没有btn组。然后，对于这两组，只需执行

。。。您的按钮在这里…

希望这有帮助。

这就成功了

洛勒姆
乱数假文

谢谢您，这样做并进一步向上移动

数据切换

有效。亲爱的同事们。。你能提供一个有效的例子吗？我正试图把同样的东西存档，但没有成功。。非常感谢！恐怕太晚了，我已经用另一种方式解决了这件事。。。代码与Mariano在其帖子中给出的示例非常相似。我只想把属于同一组的单选按钮放在两行不同的位置。我无法在不破坏css样式的情况下将其归档。（我能够做到这一点，但按钮的css样式是单选按钮和按钮的混合，因此可视化效果很差）你知道如何使用react bootstrap做到这一点吗？尝试组合按钮组和切换按钮组-不起作用

<div data-toggle="buttons">
    <div class="btn-group btn-group-justified">
        <label class="btn btn-default">
            <input type="radio"> Lorem
        </label>
    </div>
    <div class="btn-group btn-group-justified">
        <label class="btn btn-default">
            <input type="radio"> ipsum
        </label>
    </div>
</div>