ブートストラップボタングループ多くの中から任意の2つのチェックボックスを選択

Question

4-5個のチェックボックスから2つのチェックボックスを選択する必要があります。私はブートストラップを使用しています。

は、以下の私のコード

<div class="btn-group" data-toggle="buttons"> 
    <label class="btn btn-primary active"> 
    <input type="checkbox" autocomplete="off" checked> Checkbox 1 (pre-checked) 
    </label> 
    <label class="btn btn-primary"> 
    <input type="checkbox" autocomplete="off"> Checkbox 2 
    </label> 
    <label class="btn btn-primary"> 
    <input type="checkbox" autocomplete="off"> Checkbox 3 
    </label> 
    <label class="btn btn-primary"> 
    <input type="checkbox" autocomplete="off"> Checkbox 4 
    </label> 
</div> 

ですが、私は2チェックボックスの最大値を選択できるようにしたいです。そして他の人は私がとき、私はこのために、そのためにhttp://getbootstrap.com/javascript/#buttons-checkbox-radioを使用しています

を無効にする必要がある他のラベルを無効にしても

Answer 1

ファーストクラス<input type="checkbox" class="ch" autocomplete="off">
を追加し、イベントをクリックしてくださいよりも、特定のラベルをクリックしてください `.change（）イベントハンドラを使用して、チェックボックスのオン/オフチェックボックスでコードをトリガします。ここで

$('.ch').change(function() { 
     $($('.btn-group').find("input[type='checkbox']")).each(function() { 
     $(this).attr("disabled", false); 
     }); 
     var check = $($('.btn-group').find("input[type='checkbox']:checked")).length; 
     if (check > 1) { 
     $('.btn-group').find("input[type='checkbox']").not(":checked").attr("disabled", true); 
     } 
    }); 

はjsFiddleの例である：https://jsfiddle.net/jagrati16/q8jo77c2/

Answer 2

あなたがやりたいことには、次のコードを見ることができます。

$('input[type="checkbox"]').change(function() { 
    var number = $('.btn-group').find("input[type='checkbox']:checked").length; 
    if (number > 1) { 
    $('.btn-group').find("input[type='checkbox']").not(":checked").attr("disabled", true); 
    }else { 
    $('.btn-group').find("input[type='checkbox']").attr("disabled", false); 
    } 
}); 

jsfiddleも作成しました。これがあなたの問題を解決することを願っています。