Как подтвердить, что все флажки установлены, прежде чем что-то делать?

Question

Моя цель: если все флажки установлены, человек может пойти дальше, если нет, то он перейдет на страницу оправдания.

Я нашел это в jQuery:

$("input[type='checkbox'].itemCheck").change(function(){
    var a = $("input[type='checkbox'].itemCheck");
    if(a.length == a.filter(":checked").length){
        console.log("Je vais sur la formulaire");

    }
});

Я попробовал этои это работает, но мне нужно это в vanilla js, поэтому я попытался преобразовать его, но я просто не могу понять, как это сделать.

Я попробовал другую логику, чтобы заставить это работать, но я не могу понять, как.

<input type="checkbox" name="verif" class="checkbox itemCheck">

<input type="checkbox"  name="age" class="checkbox itemCheck">

<input type="checkbox"  name="employed" class="checkbox itemCheck">

Answer 1

Ванильная версия JavaScript этого кода jQuery будет: (Добавлены комментарии, чтобы вы могли понять, что происходит)

// gets all the inputs on the page with type = "checkbox"
var checkboxes = document.querySelectorAll('input[type="checkbox"]');
// loops through each checkbox
for (var i = 0; i < checkboxes.length; i++) {
  // add an change event listener to each checkbox
  checkboxes[i].addEventListener('change', function() {
    // gets the checkboxes that are ticked (or "checked")
    var checkboxes_ticked = document.querySelectorAll('input[type="checkbox"]:checked');
    // check if the length of ticked checkboxes matches with the total checkboxes on the page
    if (checkboxes_ticked.length === checkboxes.length) {
      // all checkboxes where ticked! display your message
      console.log("Je vais sur la formulaire");
    }
  });
}

Удачи.