Question

我在表单中使用Bootstrap的btn-group，我想将选项标记为默认选项。我正在添加“活动”类。但是，当我点击另一个时，这个也变为活动状态（所以我有两个活动按钮）。

是否有一种简单的方法可以将选项设置为默认值而不会出现此问题？

        <div id="summarySize" class="btn-group col-md-4 col-md-offset-4 text-center" role="group" aria-label="Summary Size"">
            <button type="button" class="btn btn-default" name="inlineRadioOptions" id="inlineRadio1">Short</button>
            <button type="button" class="btn active btn-default" name="inlineRadioOptions" id="inlineRadio2">Medium</button>
            <button type="button" class="btn btn-default" name="inlineRadioOptions" id="inlineRadio3">Large</button>
        </div>

其他问题：当你只有一列（在智能手机上）时，为了使这个btn-group居中，你能做些什么？我尝试将“text-center”添加为一个类，但它保留在左侧。

Answer 1

Bootstrap不执行按钮组切换。你需要编写一些jQuery。

$('#summarySize .btn').click(function() {
    $(this).addClass('active').siblings().removeClass('active');
});

关于你的奖金问题 - .text-center似乎工作正常。

<强> Demo

在bootstrap的btn-group上设置默认选项

1 个答案: