は、私はこのような、<a href="http://getbootstrap.com/javascript/#buttons-checkbox-radio" rel="nofollow noreferrer">boostrap buttongroup for checkboxes</a>を作成

Question

ブートストラップbuttongroupsをuseing作成しました。私はすでに試しました：

$("#d2").attr("locked", true); 
$("#d2").attr('disabled', true); 
$("#d2").parent().attr('disabled', true); 
$("#d2").parent().addClass('disabled'); 

ボタンは無効になっていますが、その機能は削除されません。クリックするとまだactiveの状態が切り替わります。

無効ボタン2

クリック後無効ボタン2

どのように私はそれを切り替えるために、ユーザーを防ぐことができますか？ここに、この問題の抜粋例があります。

$("#d2").prop("checked", false); 
 
$("#d2").prop("locked", true); 
 
$("#d2").prop("disabled", true); 
 
$("#d2").parent().prop('disabled', true);

.active { 
 
    background-color: green!important; 
 
    color: white!important; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 

 

 
<div class="btn-group" data-toggle="buttons"> 
 
    <label class="btn btn-default"><input type="checkbox" id="d1" />1</label> 
 
    <label class="btn btn-default"><input type="checkbox" id="d2" />2</label> 
 
    <label class="btn btn-default"><input type="checkbox" id="d3" />3</label> 
 
    <label class="btn btn-default"><input type="checkbox" id="d4" />4</label> 
 
    <label class="btn btn-default"><input type="checkbox" id="d5" />5</label> 
 
    <label class="btn btn-default"><input type="checkbox" id="d6" />6</label> 
 
</div>

Answer 1

あなたは試すことができます：

$("#d2").prop('disabled', true); 

これは私のために動作します。