如何修复循环以检查复选框是否被选中，如果是，则将值附加到字符串？

Question

无法循环吐出选中复选框中的一串值。

基本Javascript.

我尝试关注其他各种 Whosebug 帖子，但都无济于事。 This and This 似乎是最接近我正在努力工作的东西。

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 循环以及我不太了解的检查复选框的东西？

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

我正在尝试创建一个字符串，如果复选框被选中，该字符串会附加一个复选框 'value'。

感谢任何帮助！

Answer 1

使用 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;
  }
}

Answer 2

document.getElementsByClassName('help-days'); 这将 return div 的列表，他们没有 checked 属性，你需要select 其中的复选框：

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>

如何修复循环以检查复选框是否被选中，如果是，则将值附加到字符串？

How to fix loop to check if checkbox is checked, and if so append value to string?

javascript

checkbox

loops

for-loop

field