Question

我正在尝试通过Bootstrap切换开关实现总启用服务的数量。所以我已经提供了每个提供的服务的Bootstrap切换开关，但是我想以这样一种方式实现，即在特定时间最多4个服务应该处于On模式。选择4切换到开启模式后，应禁用其余开关。

<input type="checkbox" data-toggle="toggle" id="toggle-event"> Service 1
<input type="checkbox" data-toggle="toggle" id="toggle-event"> Service 2
<input type="checkbox" data-toggle="toggle" id="toggle-event"> Service 3
<input type="checkbox" data-toggle="toggle" id="toggle-event"> Service 4
<input type="checkbox" data-toggle="toggle" id="toggle-event"> Service 5
<input type="checkbox" data-toggle="toggle" id="toggle-event"> Service 6

访问http://www.bootstraptoggle.com/以获取bootstrap切换开关

Answer 1

你可以这样限制：

https://jsfiddle.net/bhumi/avr803pw/

$('[type="checkbox"]').bootstrapSwitch();
 var limit = 4;
 $('[type="checkbox"]').on('switchChange.bootstrapSwitch', function(event, state) {

  if($('[type="checkbox"]:checked').length > limit ) {
   $(this).bootstrapSwitch('state', !state, true);
       alert('You are allowed to check a maximum of '+limit+' options')
   }
});

限制On Bootstrap切换开关的总数

1 个答案: