Как исправить цикл, чтобы проверить, если флажок установлен, и если да, добавить значение в строку? - PullRequest
0 голосов
/ 22 января 2019

Невозможно заставить цикл выплевывать строку значений в отмеченных флажках.

Базовый Javascript.

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

HTML это просто строка

<div class="help-days">MON<br><input type="checkbox" id="d0-field" value="Monday" aria-describedby="avail-help"></div>

Я пробовал

var element = document.getElementsByClassName('help-days');
for (var i = 0; i <= 6; i++) {
    if (element[i].checked) {
        var day = $('#d' + i + '-field').val();
        days = days + ' ' + day;
    }
}

и

for (var i = 0; i <= 6; i++) {
    var element = document.getElementById('#d' + i + '-field')
    if (element[i].checked) {
        var day = $('#d' + i + '-field').val();
        days = days + ' ' + day;
    }
}

Ниже приведен пример выводов Monday Tuesday Wednesday Thursday Friday Saturday Sunday, что наводит меня на мысль, что есть что-то с использованием HTMLCollection и для циклов и флажков, которое я не совсем понимаю?

for (var i = 0; i <= 6; i++) {
    var day = $('#d' + i + '-field').val();
    if (day) {
        days = days + ' ' + day;
    }
}

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

Любая помощь приветствуется!

Ответы [ 2 ]

0 голосов
/ 22 января 2019

document.getElementsByClassName('help-days'); это вернет список div с, и у них нет свойства checked, вам необходимо установить флажки внутри них:

for (var i = 0; i < 2; i++) {
    var checkbox = element[i].childNodes[2];

    if (checkbox.checked) {
        var day = $('#d' + i + '-field').val();
        days = days + ' ' + day;
    }
}

var days = '';

for (var i = 0; i < 3; i++) {
  var element = document.getElementById('d' + i + '-field')

  if (element.checked) {
    var day = element.value
    days += ' ' + day;
  }
}

console.log(days)
<div class="help-days">MON<br><input type="checkbox" id="d0-field" value="Monday" aria-describedby="avail-help" checked></div>
<div class="help-days">TUE<br><input type="checkbox" id="d1-field" value="Tuesday" aria-describedby="avail-help" checked></div>
<div class="help-days">WED<br><input type="checkbox" id="d2-field" value="Wednesday" aria-describedby="avail-help"></div>
0 голосов
/ 22 января 2019

Нет необходимости включать символ # при использовании document.getElementById. Символ # используется с JQuery

И вам не нужно писать element[i].checked, только element.checked, потому что element уже является ссылкой на ваш элемент-флажок.

for (var i = 0; i < 6; i++) {
  var element = document.getElementById('d' + i + '-field')

  if (element.checked) {
    var day = element.value
    days += ' ' + day;
  }
}
...