允许用户只选择一个复选框(引导复选框-x）

is possible allow a user to select only one checkbox (bootstrap checkbox-x)?

本文关键字：复选框 一个 选择 许用户 用户      更新时间：2023-09-26

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

谢谢！

True您可以也可能应该使用单选输入字段，但如果您真的想使用复选框，则可以。您可以收集您要针对的所有复选框。

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

相关文章：