Проверьте, все ли видимые выпадающие меню пусты или нет jQuery

Question

У меня есть пять checkboxes, которые подключены к скрытому раскрывающемуся списку.

Скрытый раскрывающийся список отображается при нажатии флажка.

<input type="checkbox" id="chb1" class="chk-group" name="chb" value="chb1">
<label for="chb1"> 1 </label>
<select id="slct-1">
  <option value="">Default</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value=3>3</option>
</select><br>

<input type="checkbox" id="chb2" class="chk-group" name="chb" value="chb2">
<label for="chb2"> 2 </label>
<select id="slct-2">
  <option value="">Default</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value=3>3</option>
</select><br>

<input type="checkbox" id="chb3" class="chk-group" name="chb" value="chb3">
<label for="chb3"> 3 </label>
<select id="slct-3">
  <option value="">Default</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value=3>3</option>
</select><br>

<input type="checkbox" id="chb4" class="chk-group" name="chb" value="chb4">
<label for="chb4"> 4 </label>
<select id="slct-4">
  <option value="">Default</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value=3>3</option>
</select><br>

<input type="checkbox" id="chb5" class="chk-group" name="chb" value="chb5">
<label for="chb5"> 5 </label>
<select id="slct-1">
  <option value="">Default</option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value=3>3</option>
</select><br> 

Я хочу проверить, все ли видимые раскрывающиеся меню пусты или нет.

Я пробовал этот код ниже, он работает, но это не то, что он должен делать,

Результат этого кода: - Когда я устанавливаю флажки 1, 2 и 3, а затем изменяю раскрывающийся выбор 3, он немедленно возвращает истину, даже если раскрывающийся список 1 и 2 пуст.

Ожидаемый результат - он должен возвращать истину, только если все видимые раскрывающиеся списки не пусты.

Вот код

$('input[name="chb"]').click(function(){
    checker();
  $('select[id^="slct-"]').change(function () {
      checker();
  });

});


function checker() {
  $('input[name="chb"]:checked').each(function () {
        var idnum = $(this).prop('id').replace(/[^\d.]/g, '');
        if (idnum != 1 || idnum != 2 || idnum != 19) {
            if ($('#slct-' + idnum + ' option:selected').val() === "") {
                $('span#text').text('False');
            } else if ($('#slct-' + idnum + ' option:selected').val() != "") {
                $('span#text').text('True');
            }
        }
   });
}

Вот ссылка для Codepen , чтобы попробовать этот код.

Спасибо.

Answer 1

Проблема в логах c на самом деле.

Здесь оператор if-else:

if ($('#slct-' + idnum + ' option:selected').val() === "") {
                $('span#text').text('False');
            } else if ($('#slct-' + idnum + ' option:selected').val() != "") {
                $('span#text').text('True');
            }

на самом деле перебирает все отмеченные флажки, но отображается текст как истина или ложь наконец только после последнего select значения!

Таким образом, в этом случае может быть предложено создать flag counter, которое увеличивается всякий раз, когда $('#slct-' + idnum + ' option:selected').val() != "".

Затем, если flag равно количеству отмеченных флажков, отобразить «Истина» ОДИН РАЗ после завершения каждого l oop, как показано ниже. : $('span#text').text('True'); И false в остальном аналогично.

Answer 2

Вы используете JQuery each и записываете значение для вывода, т.е. span#text на каждой итерации, это будет перезаписывать значение на каждой итерации, и последнее значение будет, в конце концов, перезаписано. Я думаю, что одно из простых исправлений:

    var i=0;
     for i = 0, $('input[name="chb"]:checked').length {
          if ($('#slct-' + idnum + ' option:selected').val() !== "") 
                   break;
    }
    if( i=== $('input[name="chb"]:checked').length)
   {
        print true
        return 
    }else {
    print false;
    }
   }

Здесь для l oop сломается, если обнаружит непустое значение. Если все значения пусты, то после завершения l oop значение i будет равно длине массива, в противном случае l oop прервется из-за непустого значения в одном из раскрывающихся списков.