Снятие галочек с других checkbox-ов по условию

#javascript #html #jquery

Есть три чекбокса.
Нужно сделать так, чтобы если активен первый чекбокс, то убирались галочки со второго
и третьего, а если второй или третий активный - убиралась галочка с первого.

Вот что у меня получилось:



$('.food_in_tour input:checkbox').change(function() {
  if ($('#eat_all').prop('checked')) {
    if ($('#not_meat').prop('checked') || $('#not_sugar').prop('checked')) {
      $('.food_in_tour input:checkbox:not(#eat_all)').prop('checked', false);
    }
  } else if ($('#not_meat').prop('checked') || $('#not_sugar').prop('checked')) {
    if ($('#eat_all').prop('checked')) {
      $('#eat_all').prop('checked', false);
     }
  }
});

    
      
      Ем все
    
    
      
      Не употребляю мясо
    
    
      
      Не ем сладкое
    







В чем ошибка, и как это можно реализовать?
    

Ответы

Ответ 1

Нужно проверять какой checkbox был нажат, а не состояние checkbox-ов после нажатия.
Если нажали на #eat_all, то убираем выделение с других checkbox-ов. Если нажали на
какой-то другой - убираем с #eat_all.
Проверку можно делать, например, с помощью ID checkbox-a:



$('.food_in_tour :checkbox').change(function() {
    if (this.id == "eat_all") {
        $('.food_in_tour :checkbox:not(#eat_all)').prop("checked", false);
    }
    else {
        $("#eat_all").prop("checked", false);
     }
});

    
      
      Ем все
    
    
      
      Не употребляю мясо
    
    
      
      Не ем сладкое