twitter-bootstrap - 多行中的 Bootstrap (单选)按钮组

Question

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

为此，我使用了 Bootstrap 的类 btn-group-justified ，然后我拆分 <input type="radio">元素分成几个按钮组，同时保持相同的名称。

这看起来不错，但是按钮的副作用是不会切换其他组中的选中元素，即使它们具有相同的 name .也就是说，它们不再像同一组中的单选按钮 .

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

有没有办法获得一个多行按钮组而不用 javascript 破解 radio 行为？

Answer 1

这成功了。

http://www.bootply.com/k067OmtNXt

<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>