множественная проверка checkbox на checked

Question

Помогите решить проблему, присвоить disable всем input, кроме двух с атрибутом checked.

То есть из всего списка можно было бы выбрать два варианта.

$(document).ready(function() {

  let count = $('.custom-control-input').length;

  $('.custom-control-input').click(function() {

    for (let i = 0; i <= count; i++) {
      if ($('.custom-control-input:not(:checked)')) {
        $('.custom-control-input').attr('disabled', 'disabled');
      }
    }
  });

});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="list">
  <li>
    <input type="checkbox" class="custom-control-input">
    <span>Роспись по стеклу</span>
  </li>
  <li>
    <input type="checkbox" class="custom-control-input">
    <span>Валяние из войлока</span>
  </li>
  <li>
    <input type="checkbox" class="custom-control-input">
    <span>Приготовление мыла</span>
  </li>
  <li>
    <input type="checkbox" class="custom-control-input">
    <span>Создание авторских украшений</span>
  </li>
  <li>
    <input type="checkbox" class="custom-control-input">
    <span>Мастер класс по живописи</span>
  </li>
  <li>
    <input type="checkbox" class="custom-control-input">
    <span>Мастер класс по флористике</span>
  </li>
</ul>

Answer 1

$('.custom-control-input').on("change", function() {
  let limitReached = ( $('.custom-control-input:checked').length == 2 );
                     // == возвращает true или false
  
  $('.custom-control-input:not(:checked)').prop("disabled", limitReached);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="list">
  <li>
    <input type="checkbox" class="custom-control-input">
    <span>Роспись по стеклу</span>
  </li>
  <li>
    <input type="checkbox" class="custom-control-input">
    <span>Валяние из войлока</span>
  </li>
  <li>
    <input type="checkbox" class="custom-control-input">
    <span>Приготовление мыла</span>
  </li>
  <li>
    <input type="checkbox" class="custom-control-input">
    <span>Создание авторских украшений</span>
  </li>
  <li>
    <input type="checkbox" class="custom-control-input">
    <span>Мастер класс по живописи</span>
  </li>
  <li>
    <input type="checkbox" class="custom-control-input">
    <span>Мастер класс по флористике</span>
  </li>
</ul>

БЛОГ НА HUSL

множественная проверка checkbox на checked

Ответы (1 шт):