$('.filter').hide();

$('input[name="checkbox1"], input[name="checkbox2"], input[name="checkbox3"]').change(function() {
  var selectedValues = [];
  
  $('input[name="checkbox1"]:checked').each(function() {
    selectedValues.push($(this).val());
  });
  
  $('input[name="checkbox2"]:checked').each(function() {
    selectedValues.push($(this).val());
  });
  
  $('input[name="checkbox3"]:checked').each(function() {
    selectedValues.push($(this).val());
  });
  
  if (selectedValues.length > 0) {
    $('.filter').hide();
    selectedValues.forEach(function(value) {
      $('.check-' + value).show();
    });
  } else {
    $('.filter').show();
  }
});

checkbox1, checkbox2 ve checkbox3 isimlerine sahip 3 checkbox grubu var. Herhangi bir grubun durumu değiştiğinde, seçilen değerleri topluyoruz. Ardından, eğer seçilen en az bir değer varsa, .filter sınıfına sahip tüm divleri gizliyoruz ($('.filter').hide()), ve seçilen değerlere göre ilgili divleri gösteriyoruz ($('.check-' + value).show()). Eğer hiçbir değer seçilmemişse, tüm divleri gösteriyoruz ($('.filter').show()).

basit örnekle anlatmaya çalıştım, umarım yardımcı olur. kolay gelsin.

ChatGPT-4 diyor ki;

Merhaba! İstediğiniz şekilde kodu düzenlemek için, checkbox gruplarını döngüler içinde işleyebiliriz. Öncelikle, HTML kısmında yeni checkbox'ları ekleyelim ve her bir grubu bir div içine alalım:

<div class="checkbox-group">
  <input type="checkbox" name="checkbox1" value="1">
  <input type="checkbox" name="checkbox1" value="2">
  <input type="checkbox" name="checkbox1" value="3">
</div>

<div class="checkbox-group">
  <input type="checkbox" name="checkbox2" value="4">
  <input type="checkbox" name="checkbox2" value="5">
  <input type="checkbox" name="checkbox2" value="6">
</div>

<div class="checkbox-group">
  <input type="checkbox" name="checkbox3" value="7">
  <input type="checkbox" name="checkbox3" value="8">
  <input type="checkbox" name="checkbox3" value="9">
</div>

Daha sonra, jQuery ile bu checkbox gruplarını işlemek için aşağıdaki JavaScript kodunu kullanabiliriz:

$('.filter').hide();
var val = true;

$('.checkbox-group').each(function() {
  var checked = false;
  
  $(this).find('input:checked').each(function(i) {
    $('.check-' + $(this).val()).show();
    val = false;
    checked = true;
  });
  
  if (!checked) {
    $(this).find('input').each(function(i) {
      $('.check-' + $(this).val()).show();
    });
  }
});

if (val) {
  $('.filter').show();
}

Bu kod, her bir checkbox grubunu işleyerek her birinde seçilenleri kontrol eder. Eğer bir grupta hiçbir checkbox seçilmemişse, o gruptaki tüm div'leri gösterir. Eğer seçim yapılmışsa, sadece seçili olan div'leri gösterir. Bu şekilde her bir grup için filtreleme işlemi gerçekleştirilmiş olur.