可能允许用户只选择一个复选框（引导复选框-x）？

Question

我正在使用引导复选框-x插件：https://github.com/kartik-v/bootstrap-checkbox-x

我该如何只允许用户只选择一个复选框？

选项1

  <div class="col-md-12 has-success bottom-10 no-padding-left"> 
       <input class="form-control bottom-15" id="check-2" type="checkbox" data-toggle="checkbox-x" data-size="sm" data-three-state="false"> 
       <label class="cbx-label" for="check-2">Option 2 </label> 
      </div> 

      <div class="col-md-12 has-success bottom-10 no-padding-left"> 
       <input class="form-control bottom-15" id="check-3" type="checkbox" data-toggle="checkbox-x" data-size="sm" data-three-state="false"> 
       <label class="cbx-label" for="check-3">Option 3 </label> 
      </div> 

谢谢！

Answer 1

真的，你可以也可能应该使用无线电输入字段，但如果你真的想要使用复选框，你可以。您可以收集您定位的所有复选框。

var chkBox = $('input[type="checkbox"]'); 

然后在点击复选框后点击一个点击事件监听器来触发。然后它将禁用所有您收集/定位的复选框。

$(chkBox).on('click', function(){ 
    if ($(this).prop("checked")) { 
     $(this).siblings().prop("disabled", true); 
    } else { 
     $(this).siblings().prop("disabled", false); 
    } 
}); 

我添加了一个else语句来切换复选框的状态。如果您只是想禁用它们，您可以将其删除。