Bootstrap-Taste Gruppe aktivierbare nicht

Question

Ich versuche, die aktive Klasse in dieser Feldgruppe zu vermeiden:

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

Ich habe tryied mit:

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

aber keine Weise. Nach was ich suche, ist eine Knopfgruppe, die geklickt werden kann, aber keiner der Knöpfe wird die aktive Klasse manten.

Vielen Dank im Voraus.

Answer 1

Verwenden Sie keine Optionsfelder.

Von http://getbootstrap.com/components/#btn-groups-single (zu Ihrem Beispiel modifiziert):

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