将表格单元格链接到复选框 Javascript

Question

我有一组几个月的复选框，我还有一个包含每个月单元格的表格。单元格的“data-val”属性与复选框的“id”相同。我想在表格单元格中添加一个 onClick，以便在单击单元格时，只要选中表格单元格，就应该选中与单元格“data-val”具有相同“id”的复选框。

到目前为止，我已经成功地将 onClick 注册到表格单元格。但是，当单击单个单元格而不是相应的复选框时，会选中所有复选框。我该如何解决这个问题？

        function MonthCalCheck() {

        const checkboxMonthElement = document.querySelectorAll('.checkboxMonth');
        var cells = document.querySelectorAll('#Month_Table td');

        cells.forEach(f => f.addEventListener('click', event => {

            for (var x = 0; x < checkboxMonthElement.length; x++) {

                if (cells[x].getAttribute('data-val') == checkboxMonthElement[x].getAttribute('id')) {

                    checkboxMonthElement[x].checked = true;
                }   
            }
        }));


    }

    MonthCalCheck();

Answer 1

您使用的是forEach，而不是使用变量f 作为迭代中的当前元素，而是使用cells[x]，在比较它们的数据值时确实等于checkboxMonthElement[x]。

将cells[x] 替换为f。