Question

我试图避开此按钮组中的活动类：

<div class="btn-group" data-toggle="buttons">
    <label id="level1" class="btn btn-xs btn-default">
        <input type="radio" name="options" id="option1" />
        <span class="fa fa-square fa-square-1"></span>
    </label>
    <label id="level2" class="btn btn-xs btn-default">
        <input type="radio" name="options" id="option1" />
        <span class="fa fa-square fa-square-1"></span>
    </label>
    <label id="level3" class="btn btn-xs btn-default">
        <input type="radio" name="options" id="option1" />
        <span class="fa fa-square fa-square-1"></span>
    </label>
</div>

我已经尝试过：

$(document).on("click", '#level1, #level2, #level3', function (e) {
    $(this).removeClass('active');
    event.stopPropagation();
});

但没办法。我正在寻找的是拥有一个可以点击的按钮组，但没有任何一个按钮可以操作活动类。

提前致谢。

Answer 1

不要使用单选按钮。

从http://getbootstrap.com/components/#btn-groups-single（修改为您的示例）：

<div class="btn-group btn-group-xs" role="group" aria-label="...">
  <button id="level1" type="button" class="btn btn-default">
    <span class="fa fa-square fa-square-1"></span>
  </button>
  <button id="level2" type="button" class="btn btn-default">
    <span class="fa fa-square fa-square-1"></span>
  </button>
  <button id="level3" type="button" class="btn btn-default">
    <span class="fa fa-square fa-square-1"></span>
  </button>
</div>

Bootstrap按钮组无法激活

1 个答案: