是否可以允许用户只选择一个复选框（引导复选框-x）？答案

【问题标题】：is possible allow a user to select only one checkbox (bootstrap checkbox-x)?是否可以允许用户只选择一个复选框（引导复选框-x）？
【发布时间】：2016-03-30 03:01:08
【问题描述】：

我正在使用 bootstrap checkbox-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>

谢谢！

【问题讨论】：

听起来你想要一个无线电控制，而不是一个复选框。

标签： javascript jquery twitter-bootstrap checkbox

【解决方案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 语句来切换复选框状态。如果您只想禁用它们，可以将其删除。

【讨论】：